├── .gitignore
├── LICENSE
├── README.md
├── app
    ├── __init__.py
    ├── configs.py
    ├── models
    │   ├── __init__.py
    │   └── models.py
    ├── static
    │   ├── css
    │   │   └── dashboard.css
    │   ├── echarts-liquidfill
    │   │   ├── echarts-liquidfill.min.js
    │   │   └── echarts-liquidfill.min.js.map
    │   ├── images
    │   │   ├── face.png
    │   │   ├── qq.jpg
    │   │   ├── qq_group.jpg
    │   │   └── weixin.jpg
    │   └── js
    │   │   ├── analogClock.js
    │   │   └── monitor.js
    ├── templates
    │   ├── index.html
    │   ├── layout.html
    │   └── log.html
    ├── tools
    │   ├── __init__.py
    │   ├── async_orm.py
    │   ├── chart.py
    │   ├── monitor.py
    │   └── sync_orm.py
    ├── urls.py
    └── views
    │   ├── __init__.py
    │   ├── views_common.py
    │   ├── views_index.py
    │   ├── views_log.py
    │   └── views_real_time.py
├── log.py
├── manage.py
├── nginx.conf
├── requirements.txt
└── supervisord.conf


/.gitignore:
--------------------------------------------------------------------------------
  1 | # Byte-compiled / optimized / DLL files
  2 | __pycache__/
  3 | *.py[cod]
  4 | *$py.class
  5 | 
  6 | # C extensions
  7 | *.so
  8 | 
  9 | # Distribution / packaging
 10 | .Python
 11 | build/
 12 | develop-eggs/
 13 | dist/
 14 | downloads/
 15 | eggs/
 16 | .eggs/
 17 | lib/
 18 | lib64/
 19 | parts/
 20 | sdist/
 21 | var/
 22 | wheels/
 23 | *.egg-info/
 24 | .installed.cfg
 25 | *.egg
 26 | MANIFEST
 27 | 
 28 | # PyInstaller
 29 | #  Usually these files are written by a python script from a template
 30 | #  before PyInstaller builds the exe, so as to inject date/other infos into it.
 31 | *.manifest
 32 | *.spec
 33 | 
 34 | # Installer logs
 35 | pip-log.txt
 36 | pip-delete-this-directory.txt
 37 | 
 38 | # Unit test / coverage reports
 39 | htmlcov/
 40 | .tox/
 41 | .coverage
 42 | .coverage.*
 43 | .cache
 44 | nosetests.xml
 45 | coverage.xml
 46 | *.cover
 47 | .hypothesis/
 48 | .pytest_cache/
 49 | 
 50 | # Translations
 51 | *.mo
 52 | *.pot
 53 | 
 54 | # Django stuff:
 55 | *.log
 56 | local_settings.py
 57 | db.sqlite3
 58 | 
 59 | # Flask stuff:
 60 | instance/
 61 | .webassets-cache
 62 | 
 63 | # Scrapy stuff:
 64 | .scrapy
 65 | 
 66 | # Sphinx documentation
 67 | docs/_build/
 68 | 
 69 | # PyBuilder
 70 | target/
 71 | 
 72 | # Jupyter Notebook
 73 | .ipynb_checkpoints
 74 | 
 75 | # pyenv
 76 | .python-version
 77 | 
 78 | # celery beat schedule file
 79 | celerybeat-schedule
 80 | 
 81 | # SageMath parsed files
 82 | *.sage.py
 83 | 
 84 | # Environments
 85 | .env
 86 | .venv
 87 | env/
 88 | venv/
 89 | ENV/
 90 | env.bak/
 91 | venv.bak/
 92 | 
 93 | # Spyder project settings
 94 | .spyderproject
 95 | .spyproject
 96 | 
 97 | # Rope project settings
 98 | .ropeproject
 99 | 
100 | # mkdocs documentation
101 | /site
102 | 
103 | # mypy
104 | .mypy_cache/
105 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2019 草根拓荒者张金龙
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # monitor-python
2 | 该项目为硬件实时监控系统，应用python、mysql、tornado、sqlalchemy、psutil、pyecharts等技术打造！
3 | 
4 | # 文档
5 | 


--------------------------------------------------------------------------------
/app/__init__.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | # 导入数据库连接驱动
 3 | import mysql.connector
 4 | # 导入web框架
 5 | import tornado.web
 6 | # 导入http服务
 7 | import tornado.httpserver
 8 | # 导入输入/输出事件循环
 9 | import tornado.ioloop
10 | # 导入配置工具
11 | import tornado.options
12 | # 导入选项、定义配置的函数
13 | from tornado.options import options, define
14 | # 导入配置
15 | from app.configs import configs, mysql_configs
16 | # 导入路由
17 | from app.urls import urls
18 | # 导入会话工厂函数
19 | from app.tools.async_orm import make_session_factory
20 | 
21 | # 定义一个服务的端口
22 | define("port", default=8000, type=int, help="运行端口")
23 | 
24 | 
25 | # 1.自定义应用
26 | class CustomApplication(tornado.web.Application):
27 |     # 重写__init__初始化构造方法
28 |     def __init__(self):
29 |         # 指定路由规则
30 |         handlers = urls
31 |         # 指定配置信息
32 |         settings = configs
33 |         # 绑定mysql
34 |         settings["local"] = make_session_factory(
35 |             'mysql+mysqlconnector://{db_user}:{db_pwd}@{db_host}:{db_port}/{db_name}?charset=utf8'.format(
36 |                 **mysql_configs
37 |             ),
38 |             pool_size=100
39 |         )
40 |         # 调用父类__init__，传入这两个参数
41 |         super(CustomApplication, self).__init__(handlers=handlers, **settings)
42 | 
43 | 
44 | # 2.自定义服务
45 | def create_server():
46 |     # 允许在命令行启动
47 |     tornado.options.parse_command_line()
48 |     # 创建http服务
49 |     http_server = tornado.httpserver.HTTPServer(
50 |         CustomApplication()
51 |     )
52 |     # 绑定监听端口
53 |     http_server.listen(options.port)
54 |     # 启动输入输出事件循环
55 |     tornado.ioloop.IOLoop.instance().start()
56 | 


--------------------------------------------------------------------------------
/app/configs.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | # 操作文件和目录
 3 | import os
 4 | 
 5 | # 获取当前文件所在的目录
 6 | root_path = os.path.dirname(__file__)
 7 | 
 8 | # 基本配置
 9 | configs = dict(
10 |     debug=False,  # 指定调试，开发者模式：True；生产模式：False
11 |     template_path=os.path.join(root_path, "templates"),  # 指定模板路径
12 |     static_path=os.path.join(root_path, "static")  # 指定静态路径
13 | )
14 | 
15 | # 数据库配置
16 | mysql_configs = dict(
17 |     db_host="127.0.0.1",  # 主机地址
18 |     db_name="monitor",  # 数据库名称
19 |     db_port=3306,  # 数据库端口
20 |     db_user="root",  # 数据库用户
21 |     db_pwd="root"  # 数据库密码
22 | )
23 | 


--------------------------------------------------------------------------------
/app/models/__init__.py:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thznote/monitor-python/5c5cb16ebc693734ec4df07e892ab3f60cf20c55/app/models/__init__.py


--------------------------------------------------------------------------------
/app/models/models.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | # 导入工厂函数
 3 | from sqlalchemy.ext.declarative import declarative_base
 4 | # 导入字段类型
 5 | from sqlalchemy.dialects.mysql import BIGINT, DECIMAL, DATE, TIME, DATETIME
 6 | # 导入创建字段的类
 7 | from sqlalchemy import Column
 8 | 
 9 | # 导入数据库配置
10 | # from app.configs import mysql_configs
11 | 
12 | # 创建基类
13 | Base = declarative_base()
14 | # 创建元类
15 | metadata = Base.metadata
16 | 
17 | 
18 | # 内存统计模型
19 | class Mem(Base):
20 |     __tablename__ = "mem"  # 表名称
21 |     id = Column(BIGINT, primary_key=True)  # 主键编号
22 |     percent = Column(DECIMAL(6, 2))  # 内存使用率
23 |     total = Column(DECIMAL(8, 2))  # 内存总量
24 |     used = Column(DECIMAL(8, 2))  # 内存使用量
25 |     free = Column(DECIMAL(8, 2))  # 内存剩余量
26 |     create_date = Column(DATE)  # 创建日期
27 |     create_time = Column(TIME)  # 创建时间
28 |     create_dt = Column(DATETIME)  # 创建日期时间
29 | 
30 | 
31 | # 交换分区统计
32 | class Swap(Base):
33 |     __tablename__ = "swap"  # 表名称
34 |     id = Column(BIGINT, primary_key=True)  # 主键编号
35 |     percent = Column(DECIMAL(6, 2))  # 交换分区使用率
36 |     total = Column(DECIMAL(8, 2))  # 交换分区总量
37 |     used = Column(DECIMAL(8, 2))  # 交换分区使用量
38 |     free = Column(DECIMAL(8, 2))  # 交换分区剩余量
39 |     create_date = Column(DATE)  # 创建日期
40 |     create_time = Column(TIME)  # 创建时间
41 |     create_dt = Column(DATETIME)  # 创建日期时间
42 | 
43 | 
44 | # CPU统计
45 | class Cpu(Base):
46 |     __tablename__ = "cpu"  # 表名称
47 |     id = Column(BIGINT, primary_key=True)  # 主键编号
48 |     percent = Column(DECIMAL(6, 2))  # CPU使用率
49 |     create_date = Column(DATE)  # 创建日期
50 |     create_time = Column(TIME)  # 创建时间
51 |     create_dt = Column(DATETIME)  # 创建日期时间
52 | 
53 | 
54 | def create_table():
55 |     mysql_configs = dict(
56 |         db_host="127.0.0.1",  # 主机地址
57 |         db_name="monitor",  # 数据库名称
58 |         db_port=3306,  # 数据库端口
59 |         db_user="root",  # 数据库用户
60 |         db_pwd="root"  # 数据库密码
61 |     )
62 |     # 1.导入数据库连接驱动
63 |     import mysql.connector
64 |     # 2.导入创建引擎的函数
65 |     from sqlalchemy import create_engine
66 |     # 3.连接格式：mysql+驱动名称://用户:密码@主机:端口/数据库名称
67 |     link = "mysql+mysqlconnector://{db_user}:{db_pwd}@{db_host}:{db_port}/{db_name}".format(
68 |         **mysql_configs
69 |     )
70 |     # 4.创建连接引擎，encoding定义编码，echo是(True)否(False)输出日志
71 |     engine = create_engine(link, encoding="utf-8", echo=True)
72 |     # 5.将模型映射为数据表
73 |     metadata.create_all(engine)
74 | 
75 | 
76 | if __name__ == "__main__":
77 |     # 创建数据表
78 |     create_table()
79 | 


--------------------------------------------------------------------------------
/app/static/css/dashboard.css:
--------------------------------------------------------------------------------
  1 | * {
  2 |     font-size: 14px;
  3 |     font-family: "Microsoft YaHei";
  4 | }
  5 | 
  6 | .table {
  7 |     margin-top: 12px;
  8 |     color: white;
  9 | }
 10 | 
 11 | .table td, .table th {
 12 |     vertical-align: middle;
 13 | }
 14 | 
 15 | .table-bordered td, .table-bordered th {
 16 |     border: 1px solid white;
 17 | }
 18 | 
 19 | .card {
 20 |     margin-bottom: 12px;
 21 | }
 22 | 
 23 | .feather {
 24 |     width: 16px;
 25 |     height: 16px;
 26 |     vertical-align: text-bottom;
 27 | }
 28 | 
 29 | .pad {
 30 |     padding: 6px;
 31 | }
 32 | 
 33 | #clock {
 34 |     padding: 7px;
 35 | }
 36 | 
 37 | .pad-left {
 38 |     padding-left: 6px;
 39 | }
 40 | 
 41 | .pad-right {
 42 |     padding-right: 6px;
 43 | }
 44 | 
 45 | /*
 46 |  * Sidebar
 47 |  */
 48 | 
 49 | .sidebar {
 50 |     position: fixed;
 51 |     top: 0;
 52 |     bottom: 0;
 53 |     left: 0;
 54 |     z-index: 100; /* Behind the navbar */
 55 |     padding: 48px 0 0; /* Height of navbar */
 56 |     box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
 57 | }
 58 | 
 59 | .sidebar-sticky {
 60 |     position: relative;
 61 |     top: 0;
 62 |     height: calc(100vh - 48px);
 63 |     padding-top: .5rem;
 64 |     overflow-x: hidden;
 65 |     overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
 66 | }
 67 | 
 68 | @supports ((position: -webkit-sticky) or (position: sticky)) {
 69 |     .sidebar-sticky {
 70 |         position: -webkit-sticky;
 71 |         position: sticky;
 72 |     }
 73 | }
 74 | 
 75 | .sidebar .nav-link {
 76 |     font-weight: 500;
 77 |     color: #333;
 78 | }
 79 | 
 80 | .sidebar .nav-link .feather {
 81 |     margin-right: 4px;
 82 |     color: #999;
 83 | }
 84 | 
 85 | .sidebar .nav-link.active {
 86 |     color: #007bff;
 87 | }
 88 | 
 89 | .sidebar .nav-link:hover .feather,
 90 | .sidebar .nav-link.active .feather {
 91 |     color: inherit;
 92 | }
 93 | 
 94 | .sidebar-heading {
 95 |     font-size: .75rem;
 96 |     text-transform: uppercase;
 97 | }
 98 | 
 99 | /*
100 |  * Content
101 |  */
102 | 
103 | [role="main"] {
104 |     padding-top: 48px; /* Space for fixed navbar */
105 | }
106 | 
107 | /*
108 |  * Navbar
109 |  */
110 | 
111 | .navbar-brand {
112 |     padding-top: .75rem;
113 |     padding-bottom: .75rem;
114 |     font-size: 1rem;
115 |     background-color: rgba(0, 0, 0, .25);
116 |     box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
117 | }
118 | 
119 | .navbar .form-control {
120 |     padding: .75rem 1rem;
121 |     border-width: 0;
122 |     border-radius: 0;
123 | }
124 | 
125 | .form-control-dark {
126 |     color: #fff;
127 |     background-color: rgba(255, 255, 255, .1);
128 |     border-color: rgba(255, 255, 255, .1);
129 | }
130 | 
131 | .form-control-dark:focus {
132 |     border-color: transparent;
133 |     box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
134 | }
135 | 
136 | .foot-section {
137 |     background-color: white;
138 |     margin-bottom: 0px;
139 |     padding: 4rem 0rem;
140 | }
141 | 
142 | .blur-up {
143 |     -webkit-filter: blur(5px);
144 |     filter: blur(5px);
145 |     transition: filter 400ms, -webkit-filter 400ms;
146 | }
147 | 
148 | .blur-up.lazyloaded {
149 |     -webkit-filter: blur(0);
150 |     filter: blur(0);
151 | }
152 | 


--------------------------------------------------------------------------------
/app/static/echarts-liquidfill/echarts-liquidfill.min.js:
--------------------------------------------------------------------------------
1 | !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("echarts")):"function"==typeof define&&define.amd?define(["echarts"],e):"object"==typeof exports?exports["echarts-liquidfill"]=e(require("echarts")):t["echarts-liquidfill"]=e(t.echarts)}(window,function(t){return function(t){function e(n){if(r[n])return r[n].exports;var i=r[n]={i:n,l:!1,exports:{}};return t[n].call(i.exports,i,i.exports,e),i.l=!0,i.exports}var r={};return e.m=t,e.c=r,e.d=function(t,r,n){e.o(t,r)||Object.defineProperty(t,r,{enumerable:!0,get:n})},e.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,r){if(1&r&&(t=e(t)),8&r)return t;if(4&r&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(e.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&r&&"string"!=typeof t)for(var i in t)e.d(n,i,function(e){return t[e]}.bind(null,i));return n},e.n=function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=29)}([function(t,e){function r(t){if(null==t||"object"!=typeof t)return t;var e=t,n=v.call(t);if("[object Array]"===n){if(!c(t)){e=[];for(var i=0,a=t.length;i<a;i++)e[i]=r(t[i])}}else if(p[n]){if(!c(t)){var o=t.constructor;if(t.constructor.from)e=o.from(t);else{e=new o(t.length);for(i=0,a=t.length;i<a;i++)e[i]=r(t[i])}}}else if(!d[n]&&!c(t)&&!u(t))for(var s in e={},t)t.hasOwnProperty(s)&&(e[s]=r(t[s]));return e}function n(t,e,i){if(!l(e)||!l(t))return i?r(e):t;for(var a in e)if(e.hasOwnProperty(a)){var o=t[a],f=e[a];!l(f)||!l(o)||s(f)||s(o)||u(f)||u(o)||h(f)||h(o)||c(f)||c(o)?!i&&a in t||(t[a]=r(e[a])):n(o,f,i)}return t}function i(t,e,r){for(var n in e)e.hasOwnProperty(n)&&(r?null!=e[n]:null==t[n])&&(t[n]=e[n]);return t}function a(t,e,r){if(t&&e)if(t.forEach&&t.forEach===y)t.forEach(e,r);else if(t.length===+t.length)for(var n=0,i=t.length;n<i;n++)e.call(r,t[n],n,t);else for(var a in t)t.hasOwnProperty(a)&&e.call(r,t[a],a,t)}function o(t,e){var r=x.call(arguments,2);return function(){return t.apply(e,r.concat(x.call(arguments)))}}function s(t){return"[object Array]"===v.call(t)}function l(t){var e=typeof t;return"function"===e||!!t&&"object"===e}function h(t){return!!d[v.call(t)]}function u(t){return"object"==typeof t&&"number"==typeof t.nodeType&&"object"==typeof t.ownerDocument}function c(t){return t[M]}function f(t){function e(t,e){r?n.set(t,e):n.set(e,t)}var r=s(t);this.data={};var n=this;t instanceof f?t.each(e):t&&a(t,e)}var d={"[object Function]":1,"[object RegExp]":1,"[object Date]":1,"[object Error]":1,"[object CanvasGradient]":1,"[object CanvasPattern]":1,"[object Image]":1,"[object Canvas]":1},p={"[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},v=Object.prototype.toString,g=Array.prototype,y=g.forEach,m=g.filter,x=g.slice,_=g.map,b=g.reduce,w={},S=function(){return w.createCanvas()};w.createCanvas=function(){return document.createElement("canvas")};var T,M="__ec_primitive__";f.prototype={constructor:f,get:function(t){return this.data.hasOwnProperty(t)?this.data[t]:null},set:function(t,e){return this.data[t]=e},each:function(t,e){for(var r in void 0!==e&&(t=o(t,e)),this.data)this.data.hasOwnProperty(r)&&t(this.data[r],r)},removeKey:function(t){delete this.data[t]}},e.$override=function(t,e){"createCanvas"===t&&(T=null),w[t]=e},e.clone=r,e.merge=n,e.mergeAll=function(t,e){for(var r=t[0],i=1,a=t.length;i<a;i++)r=n(r,t[i],e);return r},e.extend=function(t,e){for(var r in e)e.hasOwnProperty(r)&&(t[r]=e[r]);return t},e.defaults=i,e.createCanvas=S,e.getContext=function(){return T||(T=S().getContext("2d")),T},e.indexOf=function(t,e){if(t){if(t.indexOf)return t.indexOf(e);for(var r=0,n=t.length;r<n;r++)if(t[r]===e)return r}return-1},e.inherits=function(t,e){function r(){}var n=t.prototype;for(var i in r.prototype=e.prototype,t.prototype=new r,n)t.prototype[i]=n[i];t.prototype.constructor=t,t.superClass=e},e.mixin=function(t,e,r){i(t="prototype"in t?t.prototype:t,e="prototype"in e?e.prototype:e,r)},e.isArrayLike=function(t){if(t)return"string"!=typeof t&&"number"==typeof t.length},e.each=a,e.map=function(t,e,r){if(t&&e){if(t.map&&t.map===_)return t.map(e,r);for(var n=[],i=0,a=t.length;i<a;i++)n.push(e.call(r,t[i],i,t));return n}},e.reduce=function(t,e,r,n){if(t&&e){if(t.reduce&&t.reduce===b)return t.reduce(e,r,n);for(var i=0,a=t.length;i<a;i++)r=e.call(n,r,t[i],i,t);return r}},e.filter=function(t,e,r){if(t&&e){if(t.filter&&t.filter===m)return t.filter(e,r);for(var n=[],i=0,a=t.length;i<a;i++)e.call(r,t[i],i,t)&&n.push(t[i]);return n}},e.find=function(t,e,r){if(t&&e)for(var n=0,i=t.length;n<i;n++)if(e.call(r,t[n],n,t))return t[n]},e.bind=o,e.curry=function(t){var e=x.call(arguments,1);return function(){return t.apply(this,e.concat(x.call(arguments)))}},e.isArray=s,e.isFunction=function(t){return"function"==typeof t},e.isString=function(t){return"[object String]"===v.call(t)},e.isObject=l,e.isBuiltInObject=h,e.isTypedArray=function(t){return!!p[v.call(t)]},e.isDom=u,e.eqNaN=function(t){return t!=t},e.retrieve=function(t){for(var e=0,r=arguments.length;e<r;e++)if(null!=arguments[e])return arguments[e]},e.retrieve2=function(t,e){return null!=t?t:e},e.retrieve3=function(t,e,r){return null!=t?t:null!=e?e:r},e.slice=function(){return Function.call.apply(x,arguments)},e.normalizeCssArray=function(t){if("number"==typeof t)return[t,t,t,t];var e=t.length;return 2===e?[t[0],t[1],t[0],t[1]]:3===e?[t[0],t[1],t[2],t[1]]:t},e.assert=function(t,e){if(!t)throw new Error(e)},e.trim=function(t){return null==t?null:"function"==typeof t.trim?t.trim():t.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,"")},e.setAsPrimitive=function(t){t[M]=!0},e.isPrimitive=c,e.createHashMap=function(t){return new f(t)},e.concatArray=function(t,e){for(var r=new t.constructor(t.length+e.length),n=0;n<t.length;n++)r[n]=t[n];var i=t.length;for(n=0;n<e.length;n++)r[n+i]=e[n];return r},e.noop=function(){}},function(t,e,r){function n(t){i.call(this,t),this.path=null}var i=r(7),a=r(0),o=r(9),s=r(52),l=r(58).prototype.getCanvasPattern,h=Math.abs,u=new o(!0);n.prototype={constructor:n,type:"path",__dirtyPath:!0,strokeContainThreshold:5,subPixelOptimize:!1,brush:function(t,e){var r,n=this.style,i=this.path||u,a=n.hasStroke(),o=n.hasFill(),s=n.fill,h=n.stroke,c=o&&!!s.colorStops,f=a&&!!h.colorStops,d=o&&!!s.image,p=a&&!!h.image;(n.bind(t,this,e),this.setTransform(t),this.__dirty)&&(c&&(r=r||this.getBoundingRect(),this._fillGradient=n.getGradient(t,s,r)),f&&(r=r||this.getBoundingRect(),this._strokeGradient=n.getGradient(t,h,r)));c?t.fillStyle=this._fillGradient:d&&(t.fillStyle=l.call(s,t)),f?t.strokeStyle=this._strokeGradient:p&&(t.strokeStyle=l.call(h,t));var v=n.lineDash,g=n.lineDashOffset,y=!!t.setLineDash,m=this.getGlobalScale();if(i.setScale(m[0],m[1]),this.__dirtyPath||v&&!y&&a?(i.beginPath(t),v&&!y&&(i.setLineDash(v),i.setLineDashOffset(g)),this.buildPath(i,this.shape,!1),this.path&&(this.__dirtyPath=!1)):(t.beginPath(),this.path.rebuildPath(t)),o)if(null!=n.fillOpacity){var x=t.globalAlpha;t.globalAlpha=n.fillOpacity*n.opacity,i.fill(t),t.globalAlpha=x}else i.fill(t);if(v&&y&&(t.setLineDash(v),t.lineDashOffset=g),a)if(null!=n.strokeOpacity){x=t.globalAlpha;t.globalAlpha=n.strokeOpacity*n.opacity,i.stroke(t),t.globalAlpha=x}else i.stroke(t);v&&y&&t.setLineDash([]),null!=n.text&&(this.restoreTransform(t),this.drawRectText(t,this.getBoundingRect()))},buildPath:function(t,e,r){},createPathProxy:function(){this.path=new o},getBoundingRect:function(){var t=this._rect,e=this.style,r=!t;if(r){var n=this.path;n||(n=this.path=new o),this.__dirtyPath&&(n.beginPath(),this.buildPath(n,this.shape,!1)),t=n.getBoundingRect()}if(this._rect=t,e.hasStroke()){var i=this._rectWithStroke||(this._rectWithStroke=t.clone());if(this.__dirty||r){i.copy(t);var a=e.lineWidth,s=e.strokeNoScale?this.getLineScale():1;e.hasFill()||(a=Math.max(a,this.strokeContainThreshold||4)),s>1e-10&&(i.width+=a/s,i.height+=a/s,i.x-=a/s/2,i.y-=a/s/2)}return i}return t},contain:function(t,e){var r=this.transformCoordToLocal(t,e),n=this.getBoundingRect(),i=this.style;if(t=r[0],e=r[1],n.contain(t,e)){var a=this.path.data;if(i.hasStroke()){var o=i.lineWidth,l=i.strokeNoScale?this.getLineScale():1;if(l>1e-10&&(i.hasFill()||(o=Math.max(o,this.strokeContainThreshold)),s.containStroke(a,o/l,t,e)))return!0}if(i.hasFill())return s.contain(a,t,e)}return!1},dirty:function(t){null==t&&(t=!0),t&&(this.__dirtyPath=t,this._rect=null),this.__dirty=this.__dirtyText=!0,this.__zr&&this.__zr.refresh(),this.__clipTarget&&this.__clipTarget.dirty()},animateShape:function(t){return this.animate("shape",t)},attrKV:function(t,e){"shape"===t?(this.setShape(e),this.__dirtyPath=!0,this._rect=null):i.prototype.attrKV.call(this,t,e)},setShape:function(t,e){var r=this.shape;if(r){if(a.isObject(t))for(var n in t)t.hasOwnProperty(n)&&(r[n]=t[n]);else r[t]=e;this.dirty(!0)}return this},getLineScale:function(){var t=this.transform;return t&&h(t[0]-1)>1e-10&&h(t[3]-1)>1e-10?Math.sqrt(h(t[0]*t[3]-t[2]*t[1])):1}},n.extend=function(t){var e=function(e){n.call(this,e),t.style&&this.style.extendFrom(t.style,!1);var r=t.shape;if(r){this.shape=this.shape||{};var i=this.shape;for(var a in r)!i.hasOwnProperty(a)&&r.hasOwnProperty(a)&&(i[a]=r[a])}t.init&&t.init.call(this,e)};for(var r in a.inherits(e,n),t)"style"!==r&&"shape"!==r&&(e.prototype[r]=t[r]);return e},a.inherits(n,i);var c=n;t.exports=c},function(t,e){function r(t){return Math.sqrt(n(t))}function n(t){return t[0]*t[0]+t[1]*t[1]}function i(t,e){return Math.sqrt((t[0]-e[0])*(t[0]-e[0])+(t[1]-e[1])*(t[1]-e[1]))}function a(t,e){return(t[0]-e[0])*(t[0]-e[0])+(t[1]-e[1])*(t[1]-e[1])}var o="undefined"==typeof Float32Array?Array:Float32Array,s=r,l=n,h=i,u=a;e.create=function(t,e){var r=new o(2);return null==t&&(t=0),null==e&&(e=0),r[0]=t,r[1]=e,r},e.copy=function(t,e){return t[0]=e[0],t[1]=e[1],t},e.clone=function(t){var e=new o(2);return e[0]=t[0],e[1]=t[1],e},e.set=function(t,e,r){return t[0]=e,t[1]=r,t},e.add=function(t,e,r){return t[0]=e[0]+r[0],t[1]=e[1]+r[1],t},e.scaleAndAdd=function(t,e,r,n){return t[0]=e[0]+r[0]*n,t[1]=e[1]+r[1]*n,t},e.sub=function(t,e,r){return t[0]=e[0]-r[0],t[1]=e[1]-r[1],t},e.len=r,e.length=s,e.lenSquare=n,e.lengthSquare=l,e.mul=function(t,e,r){return t[0]=e[0]*r[0],t[1]=e[1]*r[1],t},e.div=function(t,e,r){return t[0]=e[0]/r[0],t[1]=e[1]/r[1],t},e.dot=function(t,e){return t[0]*e[0]+t[1]*e[1]},e.scale=function(t,e,r){return t[0]=e[0]*r,t[1]=e[1]*r,t},e.normalize=function(t,e){var n=r(e);return 0===n?(t[0]=0,t[1]=0):(t[0]=e[0]/n,t[1]=e[1]/n),t},e.distance=i,e.dist=h,e.distanceSquare=a,e.distSquare=u,e.negate=function(t,e){return t[0]=-e[0],t[1]=-e[1],t},e.lerp=function(t,e,r,n){return t[0]=e[0]+n*(r[0]-e[0]),t[1]=e[1]+n*(r[1]-e[1]),t},e.applyTransform=function(t,e,r){var n=e[0],i=e[1];return t[0]=r[0]*n+r[2]*i+r[4],t[1]=r[1]*n+r[3]*i+r[5],t},e.min=function(t,e,r){return t[0]=Math.min(e[0],r[0]),t[1]=Math.min(e[1],r[1]),t},e.max=function(t,e,r){return t[0]=Math.max(e[0],r[0]),t[1]=Math.max(e[1],r[1]),t}},function(t,e,r){function n(t,e,r,n){r<0&&(t+=r,r=-r),n<0&&(e+=n,n=-n),this.x=t,this.y=e,this.width=r,this.height=n}var i=r(2),a=r(10),o=i.applyTransform,s=Math.min,l=Math.max;n.prototype={constructor:n,union:function(t){var e=s(t.x,this.x),r=s(t.y,this.y);this.width=l(t.x+t.width,this.x+this.width)-e,this.height=l(t.y+t.height,this.y+this.height)-r,this.x=e,this.y=r},applyTransform:function(){var t=[],e=[],r=[],n=[];return function(i){if(i){t[0]=r[0]=this.x,t[1]=n[1]=this.y,e[0]=n[0]=this.x+this.width,e[1]=r[1]=this.y+this.height,o(t,t,i),o(e,e,i),o(r,r,i),o(n,n,i),this.x=s(t[0],e[0],r[0],n[0]),this.y=s(t[1],e[1],r[1],n[1]);var a=l(t[0],e[0],r[0],n[0]),h=l(t[1],e[1],r[1],n[1]);this.width=a-this.x,this.height=h-this.y}}}(),calculateTransform:function(t){var e=this,r=t.width/e.width,n=t.height/e.height,i=a.create();return a.translate(i,i,[-e.x,-e.y]),a.scale(i,i,[r,n]),a.translate(i,i,[t.x,t.y]),i},intersect:function(t){if(!t)return!1;t instanceof n||(t=n.create(t));var e=this,r=e.x,i=e.x+e.width,a=e.y,o=e.y+e.height,s=t.x,l=t.x+t.width,h=t.y,u=t.y+t.height;return!(i<s||l<r||o<h||u<a)},contain:function(t,e){var r=this;return t>=r.x&&t<=r.x+r.width&&e>=r.y&&e<=r.y+r.height},clone:function(){return new n(this.x,this.y,this.width,this.height)},copy:function(t){this.x=t.x,this.y=t.y,this.width=t.width,this.height=t.height},plain:function(){return{x:this.x,y:this.y,width:this.width,height:this.height}}},n.create=function(t){return new n(t.x,t.y,t.width,t.height)};var h=n;t.exports=h},function(t,e,r){function n(t){return t>-f&&t<f}function i(t){return t>f||t<-f}function a(t,e,r,n,i){var a=1-i;return a*a*(a*t+3*i*e)+i*i*(i*n+3*a*r)}function o(t,e,r,n){var i=1-n;return i*(i*t+2*n*e)+n*n*r}var s=r(2),l=s.create,h=s.distSquare,u=Math.pow,c=Math.sqrt,f=1e-8,d=1e-4,p=c(3),v=1/3,g=l(),y=l(),m=l();e.cubicAt=a,e.cubicDerivativeAt=function(t,e,r,n,i){var a=1-i;return 3*(((e-t)*a+2*(r-e)*i)*a+(n-r)*i*i)},e.cubicRootAt=function(t,e,r,i,a,o){var s=i+3*(e-r)-t,l=3*(r-2*e+t),h=3*(e-t),f=t-a,d=l*l-3*s*h,g=l*h-9*s*f,y=h*h-3*l*f,m=0;if(n(d)&&n(g))n(l)?o[0]=0:(C=-h/l)>=0&&C<=1&&(o[m++]=C);else{var x=g*g-4*d*y;if(n(x)){var _=g/d,b=-_/2;(C=-l/s+_)>=0&&C<=1&&(o[m++]=C),b>=0&&b<=1&&(o[m++]=b)}else if(x>0){var w=c(x),S=d*l+1.5*s*(-g+w),T=d*l+1.5*s*(-g-w);(C=(-l-((S=S<0?-u(-S,v):u(S,v))+(T=T<0?-u(-T,v):u(T,v))))/(3*s))>=0&&C<=1&&(o[m++]=C)}else{var M=(2*d*l-3*s*g)/(2*c(d*d*d)),P=Math.acos(M)/3,k=c(d),O=Math.cos(P),C=(-l-2*k*O)/(3*s),A=(b=(-l+k*(O+p*Math.sin(P)))/(3*s),(-l+k*(O-p*Math.sin(P)))/(3*s));C>=0&&C<=1&&(o[m++]=C),b>=0&&b<=1&&(o[m++]=b),A>=0&&A<=1&&(o[m++]=A)}}return m},e.cubicExtrema=function(t,e,r,a,o){var s=6*r-12*e+6*t,l=9*e+3*a-3*t-9*r,h=3*e-3*t,u=0;if(n(l))i(s)&&(d=-h/s)>=0&&d<=1&&(o[u++]=d);else{var f=s*s-4*l*h;if(n(f))o[0]=-s/(2*l);else if(f>0){var d,p=c(f),v=(-s-p)/(2*l);(d=(-s+p)/(2*l))>=0&&d<=1&&(o[u++]=d),v>=0&&v<=1&&(o[u++]=v)}}return u},e.cubicSubdivide=function(t,e,r,n,i,a){var o=(e-t)*i+t,s=(r-e)*i+e,l=(n-r)*i+r,h=(s-o)*i+o,u=(l-s)*i+s,c=(u-h)*i+h;a[0]=t,a[1]=o,a[2]=h,a[3]=c,a[4]=c,a[5]=u,a[6]=l,a[7]=n},e.cubicProjectPoint=function(t,e,r,n,i,o,s,l,u,f,p){var v,x,_,b,w,S=.005,T=1/0;g[0]=u,g[1]=f;for(var M=0;M<1;M+=.05)y[0]=a(t,r,i,s,M),y[1]=a(e,n,o,l,M),(b=h(g,y))<T&&(v=M,T=b);T=1/0;for(var P=0;P<32&&!(S<d);P++)x=v-S,_=v+S,y[0]=a(t,r,i,s,x),y[1]=a(e,n,o,l,x),b=h(y,g),x>=0&&b<T?(v=x,T=b):(m[0]=a(t,r,i,s,_),m[1]=a(e,n,o,l,_),w=h(m,g),_<=1&&w<T?(v=_,T=w):S*=.5);return p&&(p[0]=a(t,r,i,s,v),p[1]=a(e,n,o,l,v)),c(T)},e.quadraticAt=o,e.quadraticDerivativeAt=function(t,e,r,n){return 2*((1-n)*(e-t)+n*(r-e))},e.quadraticRootAt=function(t,e,r,a,o){var s=t-2*e+r,l=2*(e-t),h=t-a,u=0;if(n(s))i(l)&&(d=-h/l)>=0&&d<=1&&(o[u++]=d);else{var f=l*l-4*s*h;if(n(f))(d=-l/(2*s))>=0&&d<=1&&(o[u++]=d);else if(f>0){var d,p=c(f),v=(-l-p)/(2*s);(d=(-l+p)/(2*s))>=0&&d<=1&&(o[u++]=d),v>=0&&v<=1&&(o[u++]=v)}}return u},e.quadraticExtremum=function(t,e,r){var n=t+r-2*e;return 0===n?.5:(t-e)/n},e.quadraticSubdivide=function(t,e,r,n,i){var a=(e-t)*n+t,o=(r-e)*n+e,s=(o-a)*n+a;i[0]=t,i[1]=a,i[2]=s,i[3]=s,i[4]=o,i[5]=r},e.quadraticProjectPoint=function(t,e,r,n,i,a,s,l,u){var f,p=.005,v=1/0;g[0]=s,g[1]=l;for(var x=0;x<1;x+=.05)y[0]=o(t,r,i,x),y[1]=o(e,n,a,x),(S=h(g,y))<v&&(f=x,v=S);v=1/0;for(var _=0;_<32&&!(p<d);_++){var b=f-p,w=f+p;y[0]=o(t,r,i,b),y[1]=o(e,n,a,b);var S=h(y,g);if(b>=0&&S<v)f=b,v=S;else{m[0]=o(t,r,i,w),m[1]=o(e,n,a,w);var T=h(m,g);w<=1&&T<v?(f=w,v=T):p*=.5}}return u&&(u[0]=o(t,r,i,f),u[1]=o(e,n,a,f)),c(v)}},function(e,r){e.exports=t},function(t,e,r){(function(t){var r;"undefined"!=typeof window?r=window.__DEV__:void 0!==t&&(r=t.__DEV__),void 0===r&&(r=!0);var n=r;e.__DEV__=n}).call(this,r(34))},function(t,e,r){function n(t){for(var e in t=t||{},o.call(this,t),t)t.hasOwnProperty(e)&&"style"!==e&&(this[e]=t[e]);this.style=new a(t.style,this),this._rect=null,this.__clipPaths=[]}var i=r(0),a=r(42),o=r(17),s=r(50);n.prototype={constructor:n,type:"displayable",__dirty:!0,invisible:!1,z:0,z2:0,zlevel:0,draggable:!1,dragging:!1,silent:!1,culling:!1,cursor:"pointer",rectHover:!1,progressive:!1,incremental:!1,globalScaleRatio:1,beforeBrush:function(t){},afterBrush:function(t){},brush:function(t,e){},getBoundingRect:function(){},contain:function(t,e){return this.rectContain(t,e)},traverse:function(t,e){t.call(e,this)},rectContain:function(t,e){var r=this.transformCoordToLocal(t,e);return this.getBoundingRect().contain(r[0],r[1])},dirty:function(){this.__dirty=this.__dirtyText=!0,this._rect=null,this.__zr&&this.__zr.refresh()},animateStyle:function(t){return this.animate("style",t)},attrKV:function(t,e){"style"!==t?o.prototype.attrKV.call(this,t,e):this.style.set(e)},setStyle:function(t,e){return this.style.set(t,e),this.dirty(!1),this},useStyle:function(t){return this.style=new a(t,this),this.dirty(!1),this}},i.inherits(n,o),i.mixin(n,s);var l=n;t.exports=l},function(t,e){e.ContextCachedBy={NONE:0,STYLE_BIND:1,PLAIN_TEXT:2},e.WILL_BE_RESTORED=9},function(t,e,r){var n=r(4),i=r(2),a=r(51),o=r(3),s=r(21).devicePixelRatio,l={M:1,L:2,C:3,Q:4,A:5,Z:6,R:7},h=[],u=[],c=[],f=[],d=Math.min,p=Math.max,v=Math.cos,g=Math.sin,y=Math.sqrt,m=Math.abs,x="undefined"!=typeof Float32Array,_=function(t){this._saveData=!t,this._saveData&&(this.data=[]),this._ctx=null};_.prototype={constructor:_,_xi:0,_yi:0,_x0:0,_y0:0,_ux:0,_uy:0,_len:0,_lineDash:null,_dashOffset:0,_dashIdx:0,_dashSum:0,setScale:function(t,e){this._ux=m(1/s/t)||0,this._uy=m(1/s/e)||0},getContext:function(){return this._ctx},beginPath:function(t){return this._ctx=t,t&&t.beginPath(),t&&(this.dpr=t.dpr),this._saveData&&(this._len=0),this._lineDash&&(this._lineDash=null,this._dashOffset=0),this},moveTo:function(t,e){return this.addData(l.M,t,e),this._ctx&&this._ctx.moveTo(t,e),this._x0=t,this._y0=e,this._xi=t,this._yi=e,this},lineTo:function(t,e){var r=m(t-this._xi)>this._ux||m(e-this._yi)>this._uy||this._len<5;return this.addData(l.L,t,e),this._ctx&&r&&(this._needsDash()?this._dashedLineTo(t,e):this._ctx.lineTo(t,e)),r&&(this._xi=t,this._yi=e),this},bezierCurveTo:function(t,e,r,n,i,a){return this.addData(l.C,t,e,r,n,i,a),this._ctx&&(this._needsDash()?this._dashedBezierTo(t,e,r,n,i,a):this._ctx.bezierCurveTo(t,e,r,n,i,a)),this._xi=i,this._yi=a,this},quadraticCurveTo:function(t,e,r,n){return this.addData(l.Q,t,e,r,n),this._ctx&&(this._needsDash()?this._dashedQuadraticTo(t,e,r,n):this._ctx.quadraticCurveTo(t,e,r,n)),this._xi=r,this._yi=n,this},arc:function(t,e,r,n,i,a){return this.addData(l.A,t,e,r,r,n,i-n,0,a?0:1),this._ctx&&this._ctx.arc(t,e,r,n,i,a),this._xi=v(i)*r+t,this._yi=g(i)*r+e,this},arcTo:function(t,e,r,n,i){return this._ctx&&this._ctx.arcTo(t,e,r,n,i),this},rect:function(t,e,r,n){return this._ctx&&this._ctx.rect(t,e,r,n),this.addData(l.R,t,e,r,n),this},closePath:function(){this.addData(l.Z);var t=this._ctx,e=this._x0,r=this._y0;return t&&(this._needsDash()&&this._dashedLineTo(e,r),t.closePath()),this._xi=e,this._yi=r,this},fill:function(t){t&&t.fill(),this.toStatic()},stroke:function(t){t&&t.stroke(),this.toStatic()},setLineDash:function(t){if(t instanceof Array){this._lineDash=t,this._dashIdx=0;for(var e=0,r=0;r<t.length;r++)e+=t[r];this._dashSum=e}return this},setLineDashOffset:function(t){return this._dashOffset=t,this},len:function(){return this._len},setData:function(t){var e=t.length;this.data&&this.data.length===e||!x||(this.data=new Float32Array(e));for(var r=0;r<e;r++)this.data[r]=t[r];this._len=e},appendPath:function(t){t instanceof Array||(t=[t]);for(var e=t.length,r=0,n=this._len,i=0;i<e;i++)r+=t[i].len();x&&this.data instanceof Float32Array&&(this.data=new Float32Array(n+r));for(i=0;i<e;i++)for(var a=t[i].data,o=0;o<a.length;o++)this.data[n++]=a[o];this._len=n},addData:function(t){if(this._saveData){var e=this.data;this._len+arguments.length>e.length&&(this._expandData(),e=this.data);for(var r=0;r<arguments.length;r++)e[this._len++]=arguments[r];this._prevCmd=t}},_expandData:function(){if(!(this.data instanceof Array)){for(var t=[],e=0;e<this._len;e++)t[e]=this.data[e];this.data=t}},_needsDash:function(){return this._lineDash},_dashedLineTo:function(t,e){var r,n,i=this._dashSum,a=this._dashOffset,o=this._lineDash,s=this._ctx,l=this._xi,h=this._yi,u=t-l,c=e-h,f=y(u*u+c*c),v=l,g=h,m=o.length;for(u/=f,c/=f,a<0&&(a=i+a),v-=(a%=i)*u,g-=a*c;u>0&&v<=t||u<0&&v>=t||0===u&&(c>0&&g<=e||c<0&&g>=e);)v+=u*(r=o[n=this._dashIdx]),g+=c*r,this._dashIdx=(n+1)%m,u>0&&v<l||u<0&&v>l||c>0&&g<h||c<0&&g>h||s[n%2?"moveTo":"lineTo"](u>=0?d(v,t):p(v,t),c>=0?d(g,e):p(g,e));u=v-t,c=g-e,this._dashOffset=-y(u*u+c*c)},_dashedBezierTo:function(t,e,r,i,a,o){var s,l,h,u,c,f=this._dashSum,d=this._dashOffset,p=this._lineDash,v=this._ctx,g=this._xi,m=this._yi,x=n.cubicAt,_=0,b=this._dashIdx,w=p.length,S=0;for(d<0&&(d=f+d),d%=f,s=0;s<1;s+=.1)l=x(g,t,r,a,s+.1)-x(g,t,r,a,s),h=x(m,e,i,o,s+.1)-x(m,e,i,o,s),_+=y(l*l+h*h);for(;b<w&&!((S+=p[b])>d);b++);for(s=(S-d)/_;s<=1;)u=x(g,t,r,a,s),c=x(m,e,i,o,s),b%2?v.moveTo(u,c):v.lineTo(u,c),s+=p[b]/_,b=(b+1)%w;b%2!=0&&v.lineTo(a,o),l=a-u,h=o-c,this._dashOffset=-y(l*l+h*h)},_dashedQuadraticTo:function(t,e,r,n){var i=r,a=n;r=(r+2*t)/3,n=(n+2*e)/3,t=(this._xi+2*t)/3,e=(this._yi+2*e)/3,this._dashedBezierTo(t,e,r,n,i,a)},toStatic:function(){var t=this.data;t instanceof Array&&(t.length=this._len,x&&(this.data=new Float32Array(t)))},getBoundingRect:function(){h[0]=h[1]=c[0]=c[1]=Number.MAX_VALUE,u[0]=u[1]=f[0]=f[1]=-Number.MAX_VALUE;for(var t=this.data,e=0,r=0,n=0,s=0,d=0;d<t.length;){var p=t[d++];switch(1===d&&(n=e=t[d],s=r=t[d+1]),p){case l.M:e=n=t[d++],r=s=t[d++],c[0]=n,c[1]=s,f[0]=n,f[1]=s;break;case l.L:a.fromLine(e,r,t[d],t[d+1],c,f),e=t[d++],r=t[d++];break;case l.C:a.fromCubic(e,r,t[d++],t[d++],t[d++],t[d++],t[d],t[d+1],c,f),e=t[d++],r=t[d++];break;case l.Q:a.fromQuadratic(e,r,t[d++],t[d++],t[d],t[d+1],c,f),e=t[d++],r=t[d++];break;case l.A:var y=t[d++],m=t[d++],x=t[d++],_=t[d++],b=t[d++],w=t[d++]+b;d+=1;var S=1-t[d++];1===d&&(n=v(b)*x+y,s=g(b)*_+m),a.fromArc(y,m,x,_,b,w,S,c,f),e=v(w)*x+y,r=g(w)*_+m;break;case l.R:n=e=t[d++],s=r=t[d++];var T=t[d++],M=t[d++];a.fromLine(n,s,n+T,s+M,c,f);break;case l.Z:e=n,r=s}i.min(h,h,c),i.max(u,u,f)}return 0===d&&(h[0]=h[1]=u[0]=u[1]=0),new o(h[0],h[1],u[0]-h[0],u[1]-h[1])},rebuildPath:function(t){for(var e,r,n,i,a,o,s=this.data,h=this._ux,u=this._uy,c=this._len,f=0;f<c;){var d=s[f++];switch(1===f&&(e=n=s[f],r=i=s[f+1]),d){case l.M:e=n=s[f++],r=i=s[f++],t.moveTo(n,i);break;case l.L:a=s[f++],o=s[f++],(m(a-n)>h||m(o-i)>u||f===c-1)&&(t.lineTo(a,o),n=a,i=o);break;case l.C:t.bezierCurveTo(s[f++],s[f++],s[f++],s[f++],s[f++],s[f++]),n=s[f-2],i=s[f-1];break;case l.Q:t.quadraticCurveTo(s[f++],s[f++],s[f++],s[f++]),n=s[f-2],i=s[f-1];break;case l.A:var p=s[f++],y=s[f++],x=s[f++],_=s[f++],b=s[f++],w=s[f++],S=s[f++],T=s[f++],M=x>_?x:_,P=x>_?1:x/_,k=x>_?_/x:1,O=b+w;Math.abs(x-_)>.001?(t.translate(p,y),t.rotate(S),t.scale(P,k),t.arc(0,0,M,b,O,1-T),t.scale(1/P,1/k),t.rotate(-S),t.translate(-p,-y)):t.arc(p,y,M,b,O,1-T),1===f&&(e=v(b)*x+p,r=g(b)*_+y),n=v(O)*x+p,i=g(O)*_+y;break;case l.R:e=n=s[f],r=i=s[f+1],t.rect(s[f++],s[f++],s[f++],s[f++]);break;case l.Z:t.closePath(),n=e,i=r}}}},_.CMD=l;var b=_;t.exports=b},function(t,e){function r(){var t=new a(6);return n(t),t}function n(t){return t[0]=1,t[1]=0,t[2]=0,t[3]=1,t[4]=0,t[5]=0,t}function i(t,e){return t[0]=e[0],t[1]=e[1],t[2]=e[2],t[3]=e[3],t[4]=e[4],t[5]=e[5],t}var a="undefined"==typeof Float32Array?Array:Float32Array;e.create=r,e.identity=n,e.copy=i,e.mul=function(t,e,r){var n=e[0]*r[0]+e[2]*r[1],i=e[1]*r[0]+e[3]*r[1],a=e[0]*r[2]+e[2]*r[3],o=e[1]*r[2]+e[3]*r[3],s=e[0]*r[4]+e[2]*r[5]+e[4],l=e[1]*r[4]+e[3]*r[5]+e[5];return t[0]=n,t[1]=i,t[2]=a,t[3]=o,t[4]=s,t[5]=l,t},e.translate=function(t,e,r){return t[0]=e[0],t[1]=e[1],t[2]=e[2],t[3]=e[3],t[4]=e[4]+r[0],t[5]=e[5]+r[1],t},e.rotate=function(t,e,r){var n=e[0],i=e[2],a=e[4],o=e[1],s=e[3],l=e[5],h=Math.sin(r),u=Math.cos(r);return t[0]=n*u+o*h,t[1]=-n*h+o*u,t[2]=i*u+s*h,t[3]=-i*h+u*s,t[4]=u*a+h*l,t[5]=u*l-h*a,t},e.scale=function(t,e,r){var n=r[0],i=r[1];return t[0]=e[0]*n,t[1]=e[1]*i,t[2]=e[2]*n,t[3]=e[3]*i,t[4]=e[4]*n,t[5]=e[5]*i,t},e.invert=function(t,e){var r=e[0],n=e[2],i=e[4],a=e[1],o=e[3],s=e[5],l=r*o-a*n;return l?(l=1/l,t[0]=o*l,t[1]=-a*l,t[2]=-n*l,t[3]=r*l,t[4]=(n*s-o*i)*l,t[5]=(a*i-r*s)*l,t):null},e.clone=function(t){var e=r();return i(e,t),e}},function(t,e,r){function n(){var t=this.__cachedImgObj;this.onload=this.onerror=this.__cachedImgObj=null;for(var e=0;e<t.pending.length;e++){var r=t.pending[e],n=r.cb;n&&n(this,r.cbPayload),r.hostEl.dirty()}t.pending.length=0}function i(t){return t&&t.width&&t.height}var a=new(r(20))(50);e.findExistImage=function(t){if("string"==typeof t){var e=a.get(t);return e&&e.image}return t},e.createOrUpdateImage=function(t,e,r,o,s){if(t){if("string"==typeof t){if(e&&e.__zrImageSrc===t||!r)return e;var l=a.get(t),h={hostEl:r,cb:o,cbPayload:s};return l?!i(e=l.image)&&l.pending.push(h):((e=new Image).onload=e.onerror=n,a.put(t,e.__cachedImgObj={image:e,pending:[h]}),e.src=e.__zrImageSrc=t),e}return t}return e},e.isImageReady=i},function(t,e,r){function n(t){return t instanceof Array?t:null==t?[]:[t]}function i(t){return h(t)&&t.id&&0===(t.id+"").indexOf("\0_ec_\0")}function a(t,e){return t&&t.hasOwnProperty(e)}var o=r(0),s=r(13),l=o.each,h=o.isObject,u=o.isArray,c="series\0",f=0;e.normalizeToArray=n,e.defaultEmphasis=function(t,e,r){if(t){t[e]=t[e]||{},t.emphasis=t.emphasis||{},t.emphasis[e]=t.emphasis[e]||{};for(var n=0,i=r.length;n<i;n++){var a=r[n];!t.emphasis[e].hasOwnProperty(a)&&t[e].hasOwnProperty(a)&&(t.emphasis[e][a]=t[e][a])}}},e.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"],e.getDataItemValue=function(t){return!h(t)||u(t)||t instanceof Date?t:t.value},e.isDataItemOption=function(t){return h(t)&&!(t instanceof Array)},e.mappingToExists=function(t,e){e=(e||[]).slice();var r=o.map(t||[],function(t,e){return{exist:t}});return l(e,function(t,n){if(h(t)){for(var a=0;a<r.length;a++)if(!r[a].option&&null!=t.id&&r[a].exist.id===t.id+"")return r[a].option=t,void(e[n]=null);for(a=0;a<r.length;a++){var o=r[a].exist;if(!(r[a].option||null!=o.id&&null!=t.id||null==t.name||i(t)||i(o)||o.name!==t.name+""))return r[a].option=t,void(e[n]=null)}}}),l(e,function(t,e){if(h(t)){for(var n=0;n<r.length;n++){var a=r[n].exist;if(!r[n].option&&!i(a)&&null==t.id){r[n].option=t;break}}n>=r.length&&r.push({option:t})}}),r},e.makeIdAndName=function(t){var e=o.createHashMap();l(t,function(t,r){var n=t.exist;n&&e.set(n.id,t)}),l(t,function(t,r){var n=t.option;o.assert(!n||null==n.id||!e.get(n.id)||e.get(n.id)===t,"id duplicates: "+(n&&n.id)),n&&null!=n.id&&e.set(n.id,t),!t.keyInfo&&(t.keyInfo={})}),l(t,function(t,r){var n=t.exist,i=t.option,a=t.keyInfo;if(h(i)){if(a.name=null!=i.name?i.name+"":n?n.name:c+r,n)a.id=n.id;else if(null!=i.id)a.id=i.id+"";else{var o=0;do{a.id="\0"+a.name+"\0"+o++}while(e.get(a.id))}e.set(a.id,t)}})},e.isNameSpecified=function(t){var e=t.name;return!(!e||!e.indexOf(c))},e.isIdInner=i,e.compressBatches=function(t,e){function r(t,e,r){for(var i=0,a=t.length;i<a;i++)for(var o=t[i].seriesId,s=n(t[i].dataIndex),l=r&&r[o],h=0,u=s.length;h<u;h++){var c=s[h];l&&l[c]?l[c]=null:(e[o]||(e[o]={}))[c]=1}}function i(t,e){var r=[];for(var n in t)if(t.hasOwnProperty(n)&&null!=t[n])if(e)r.push(+n);else{var a=i(t[n],!0);a.length&&r.push({seriesId:n,dataIndex:a})}return r}var a={},o={};return r(t||[],a),r(e||[],o,a),[i(a),i(o)]},e.queryDataIndex=function(t,e){return null!=e.dataIndexInside?e.dataIndexInside:null!=e.dataIndex?o.isArray(e.dataIndex)?o.map(e.dataIndex,function(e){return t.indexOfRawIndex(e)}):t.indexOfRawIndex(e.dataIndex):null!=e.name?o.isArray(e.name)?o.map(e.name,function(e){return t.indexOfName(e)}):t.indexOfName(e.name):void 0},e.makeInner=function(){var t="__\0ec_inner_"+f+++"_"+Math.random().toFixed(5);return function(e){return e[t]||(e[t]={})}},e.parseFinder=function(t,e,r){if(o.isString(e)){var n={};n[e+"Index"]=0,e=n}var i=r&&r.defaultMainType;!i||a(e,i+"Index")||a(e,i+"Id")||a(e,i+"Name")||(e[i+"Index"]=0);var s={};return l(e,function(n,i){if(n=e[i],"dataIndex"!==i&&"dataIndexInside"!==i){var a=i.match(/^(\w+)(Index|Id|Name)$/)||[],l=a[1],h=(a[2]||"").toLowerCase();if(!(!l||!h||null==n||"index"===h&&"none"===n||r&&r.includeMainTypes&&o.indexOf(r.includeMainTypes,l)<0)){var u={mainType:l};"index"===h&&"all"===n||(u[h]=n);var c=t.queryComponents(u);s[l+"Models"]=c,s[l+"Model"]=c[0]}}else s[i]=n}),s},e.setAttribute=function(t,e,r){t.setAttribute?t.setAttribute(e,r):t[e]=r},e.getAttribute=function(t,e){return t.getAttribute?t.getAttribute(e):t[e]},e.getTooltipRenderMode=function(t){return"auto"===t?s.domSupported?"html":"richText":t||"html"},e.groupData=function(t,e){var r=o.createHashMap(),n=[];return o.each(t,function(t){var i=e(t);(r.get(i)||(n.push(i),r.set(i,[]))).push(t)}),{keys:n,buckets:r}}},function(t,e){var r="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasSupported:!0,domSupported:!1}:"undefined"==typeof navigator?{browser:{},os:{},node:!0,worker:!1,canvasSupported:!0,svgSupported:!0,domSupported:!1}:function(t){var e={},r=t.match(/Firefox\/([\d.]+)/),n=t.match(/MSIE\s([\d.]+)/)||t.match(/Trident\/.+?rv:(([\d.]+))/),i=t.match(/Edge\/([\d.]+)/),a=/micromessenger/i.test(t);return r&&(e.firefox=!0,e.version=r[1]),n&&(e.ie=!0,e.version=n[1]),i&&(e.edge=!0,e.version=i[1]),a&&(e.weChat=!0),{browser:e,os:{},node:!1,canvasSupported:!!document.createElement("canvas").getContext,svgSupported:"undefined"!=typeof SVGRect,touchEventsSupported:"ontouchstart"in window&&!e.ie&&!e.edge,pointerEventsSupported:"onpointerdown"in window&&(e.edge||e.ie&&e.version>=11),domSupported:"undefined"!=typeof document}}(navigator.userAgent);t.exports=r},function(t,e,r){function n(t){this.fromDataset=t.fromDataset,this.data=t.data||(t.sourceFormat===d?{}:[]),this.sourceFormat=t.sourceFormat||c,this.seriesLayoutBy=t.seriesLayoutBy||u,this.dimensionsDefine=t.dimensionsDefine,this.encodeDefine=t.encodeDefine&&a(t.encodeDefine),this.startIndex=t.startIndex||0,this.dimensionsDetectCount=t.dimensionsDetectCount}var i=r(0),a=i.createHashMap,o=i.isTypedArray,s=r(36).enableClassCheck,l=r(15),h=l.SOURCE_FORMAT_ORIGINAL,u=l.SERIES_LAYOUT_BY_COLUMN,c=l.SOURCE_FORMAT_UNKNOWN,f=l.SOURCE_FORMAT_TYPED_ARRAY,d=l.SOURCE_FORMAT_KEYED_COLUMNS;n.seriesDataToSource=function(t){return new n({data:t,sourceFormat:o(t)?f:h,fromDataset:!1})},s(n);var p=n;t.exports=p},function(t,e){e.SOURCE_FORMAT_ORIGINAL="original",e.SOURCE_FORMAT_ARRAY_ROWS="arrayRows",e.SOURCE_FORMAT_OBJECT_ROWS="objectRows",e.SOURCE_FORMAT_KEYED_COLUMNS="keyedColumns",e.SOURCE_FORMAT_UNKNOWN="unknown",e.SOURCE_FORMAT_TYPED_ARRAY="typedArray",e.SERIES_LAYOUT_BY_COLUMN="column",e.SERIES_LAYOUT_BY_ROW="row"},function(t,e){var r={shadowBlur:1,shadowOffsetX:1,shadowOffsetY:1,textShadowBlur:1,textShadowOffsetX:1,textShadowOffsetY:1,textBoxShadowBlur:1,textBoxShadowOffsetX:1,textBoxShadowOffsetY:1};t.exports=function(t,e,n){return r.hasOwnProperty(e)?n*=t.dpr:n}},function(t,e,r){var n=r(43),i=r(44),a=r(18),o=r(45),s=r(0),l=function(t){a.call(this,t),i.call(this,t),o.call(this,t),this.id=t.id||n()};l.prototype={type:"element",name:"",__zr:null,ignore:!1,clipPath:null,isGroup:!1,drift:function(t,e){switch(this.draggable){case"horizontal":e=0;break;case"vertical":t=0}var r=this.transform;r||(r=this.transform=[1,0,0,1,0,0]),r[4]+=t,r[5]+=e,this.decomposeTransform(),this.dirty(!1)},beforeUpdate:function(){},afterUpdate:function(){},update:function(){this.updateTransform()},traverse:function(t,e){},attrKV:function(t,e){if("position"===t||"scale"===t||"origin"===t){if(e){var r=this[t];r||(r=this[t]=[]),r[0]=e[0],r[1]=e[1]}}else this[t]=e},hide:function(){this.ignore=!0,this.__zr&&this.__zr.refresh()},show:function(){this.ignore=!1,this.__zr&&this.__zr.refresh()},attr:function(t,e){if("string"==typeof t)this.attrKV(t,e);else if(s.isObject(t))for(var r in t)t.hasOwnProperty(r)&&this.attrKV(r,t[r]);return this.dirty(!1),this},setClipPath:function(t){var e=this.__zr;e&&t.addSelfToZr(e),this.clipPath&&this.clipPath!==t&&this.removeClipPath(),this.clipPath=t,t.__zr=e,t.__clipTarget=this,this.dirty(!1)},removeClipPath:function(){var t=this.clipPath;t&&(t.__zr&&t.removeSelfFromZr(t.__zr),t.__zr=null,t.__clipTarget=null,this.clipPath=null,this.dirty(!1))},addSelfToZr:function(t){this.__zr=t;var e=this.animators;if(e)for(var r=0;r<e.length;r++)t.animation.addAnimator(e[r]);this.clipPath&&this.clipPath.addSelfToZr(t)},removeSelfFromZr:function(t){this.__zr=null;var e=this.animators;if(e)for(var r=0;r<e.length;r++)t.animation.removeAnimator(e[r]);this.clipPath&&this.clipPath.removeSelfFromZr(t)}},s.mixin(l,o),s.mixin(l,a),s.mixin(l,i);var h=l;t.exports=h},function(t,e,r){function n(t){return t>s||t<-s}var i=r(10),a=r(2),o=i.identity,s=5e-5,l=function(t){(t=t||{}).position||(this.position=[0,0]),null==t.rotation&&(this.rotation=0),t.scale||(this.scale=[1,1]),this.origin=this.origin||null},h=l.prototype;h.transform=null,h.needLocalTransform=function(){return n(this.rotation)||n(this.position[0])||n(this.position[1])||n(this.scale[0]-1)||n(this.scale[1]-1)};var u=[];h.updateTransform=function(){var t=this.parent,e=t&&t.transform,r=this.needLocalTransform(),n=this.transform;if(r||e){n=n||i.create(),r?this.getLocalTransform(n):o(n),e&&(r?i.mul(n,t.transform,n):i.copy(n,t.transform)),this.transform=n;var a=this.globalScaleRatio;if(null!=a&&1!==a){this.getGlobalScale(u);var s=u[0]<0?-1:1,l=u[1]<0?-1:1,h=((u[0]-s)*a+s)/u[0]||0,c=((u[1]-l)*a+l)/u[1]||0;n[0]*=h,n[1]*=h,n[2]*=c,n[3]*=c}this.invTransform=this.invTransform||i.create(),i.invert(this.invTransform,n)}else n&&o(n)},h.getLocalTransform=function(t){return l.getLocalTransform(this,t)},h.setTransform=function(t){var e=this.transform,r=t.dpr||1;e?t.setTransform(r*e[0],r*e[1],r*e[2],r*e[3],r*e[4],r*e[5]):t.setTransform(r,0,0,r,0,0)},h.restoreTransform=function(t){var e=t.dpr||1;t.setTransform(e,0,0,e,0,0)};var c=[],f=i.create();h.setLocalTransform=function(t){if(t){var e=t[0]*t[0]+t[1]*t[1],r=t[2]*t[2]+t[3]*t[3],i=this.position,a=this.scale;n(e-1)&&(e=Math.sqrt(e)),n(r-1)&&(r=Math.sqrt(r)),t[0]<0&&(e=-e),t[3]<0&&(r=-r),i[0]=t[4],i[1]=t[5],a[0]=e,a[1]=r,this.rotation=Math.atan2(-t[1]/r,t[0]/e)}},h.decomposeTransform=function(){if(this.transform){var t=this.parent,e=this.transform;t&&t.transform&&(i.mul(c,t.invTransform,e),e=c);var r=this.origin;r&&(r[0]||r[1])&&(f[4]=r[0],f[5]=r[1],i.mul(c,e,f),c[4]-=r[0],c[5]-=r[1],e=c),this.setLocalTransform(e)}},h.getGlobalScale=function(t){var e=this.transform;return t=t||[],e?(t[0]=Math.sqrt(e[0]*e[0]+e[1]*e[1]),t[1]=Math.sqrt(e[2]*e[2]+e[3]*e[3]),e[0]<0&&(t[0]=-t[0]),e[3]<0&&(t[1]=-t[1]),t):(t[0]=1,t[1]=1,t)},h.transformCoordToLocal=function(t,e){var r=[t,e],n=this.invTransform;return n&&a.applyTransform(r,r,n),r},h.transformCoordToGlobal=function(t,e){var r=[t,e],n=this.transform;return n&&a.applyTransform(r,r,n),r},l.getLocalTransform=function(t,e){o(e=e||[]);var r=t.origin,n=t.scale||[1,1],a=t.rotation||0,s=t.position||[0,0];return r&&(e[4]-=r[0],e[5]-=r[1]),i.scale(e,e,n),a&&i.rotate(e,e,a),r&&(e[4]+=r[0],e[5]+=r[1]),e[4]+=s[0],e[5]+=s[1],e};var d=l;t.exports=d},function(t,e,r){function n(t){return(t=Math.round(t))<0?0:t>255?255:t}function i(t){return t<0?0:t>1?1:t}function a(t){return n(t.length&&"%"===t.charAt(t.length-1)?parseFloat(t)/100*255:parseInt(t,10))}function o(t){return i(t.length&&"%"===t.charAt(t.length-1)?parseFloat(t)/100:parseFloat(t))}function s(t,e,r){return r<0?r+=1:r>1&&(r-=1),6*r<1?t+(e-t)*r*6:2*r<1?e:3*r<2?t+(e-t)*(2/3-r)*6:t}function l(t,e,r){return t+(e-t)*r}function h(t,e,r,n,i){return t[0]=e,t[1]=r,t[2]=n,t[3]=i,t}function u(t,e){return t[0]=e[0],t[1]=e[1],t[2]=e[2],t[3]=e[3],t}function c(t,e){x&&u(x,e),x=m.put(t,x||e.slice())}function f(t,e){if(t){e=e||[];var r=m.get(t);if(r)return u(e,r);var n=(t+="").replace(/ /g,"").toLowerCase();if(n in y)return u(e,y[n]),c(t,e),e;if("#"!==n.charAt(0)){var i=n.indexOf("("),s=n.indexOf(")");if(-1!==i&&s+1===n.length){var l=n.substr(0,i),f=n.substr(i+1,s-(i+1)).split(","),p=1;switch(l){case"rgba":if(4!==f.length)return void h(e,0,0,0,1);p=o(f.pop());case"rgb":return 3!==f.length?void h(e,0,0,0,1):(h(e,a(f[0]),a(f[1]),a(f[2]),p),c(t,e),e);case"hsla":return 4!==f.length?void h(e,0,0,0,1):(f[3]=o(f[3]),d(f,e),c(t,e),e);case"hsl":return 3!==f.length?void h(e,0,0,0,1):(d(f,e),c(t,e),e);default:return}}h(e,0,0,0,1)}else{var v;if(4===n.length)return(v=parseInt(n.substr(1),16))>=0&&v<=4095?(h(e,(3840&v)>>4|(3840&v)>>8,240&v|(240&v)>>4,15&v|(15&v)<<4,1),c(t,e),e):void h(e,0,0,0,1);if(7===n.length)return(v=parseInt(n.substr(1),16))>=0&&v<=16777215?(h(e,(16711680&v)>>16,(65280&v)>>8,255&v,1),c(t,e),e):void h(e,0,0,0,1)}}}function d(t,e){var r=(parseFloat(t[0])%360+360)%360/360,i=o(t[1]),a=o(t[2]),l=a<=.5?a*(i+1):a+i-a*i,u=2*a-l;return h(e=e||[],n(255*s(u,l,r+1/3)),n(255*s(u,l,r)),n(255*s(u,l,r-1/3)),1),4===t.length&&(e[3]=t[3]),e}function p(t,e,r){if(e&&e.length&&t>=0&&t<=1){r=r||[];var a=t*(e.length-1),o=Math.floor(a),s=Math.ceil(a),h=e[o],u=e[s],c=a-o;return r[0]=n(l(h[0],u[0],c)),r[1]=n(l(h[1],u[1],c)),r[2]=n(l(h[2],u[2],c)),r[3]=i(l(h[3],u[3],c)),r}}function v(t,e,r){if(e&&e.length&&t>=0&&t<=1){var a=t*(e.length-1),o=Math.floor(a),s=Math.ceil(a),h=f(e[o]),u=f(e[s]),c=a-o,d=g([n(l(h[0],u[0],c)),n(l(h[1],u[1],c)),n(l(h[2],u[2],c)),i(l(h[3],u[3],c))],"rgba");return r?{color:d,leftIndex:o,rightIndex:s,value:a}:d}}function g(t,e){if(t&&t.length){var r=t[0]+","+t[1]+","+t[2];return"rgba"!==e&&"hsva"!==e&&"hsla"!==e||(r+=","+t[3]),e+"("+r+")"}}var y={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]},m=new(r(20))(20),x=null,_=p,b=v;e.parse=f,e.lift=function(t,e){var r=f(t);if(r){for(var n=0;n<3;n++)r[n]=e<0?r[n]*(1-e)|0:(255-r[n])*e+r[n]|0,r[n]>255?r[n]=255:t[n]<0&&(r[n]=0);return g(r,4===r.length?"rgba":"rgb")}},e.toHex=function(t){var e=f(t);if(e)return((1<<24)+(e[0]<<16)+(e[1]<<8)+ +e[2]).toString(16).slice(1)},e.fastLerp=p,e.fastMapToColor=_,e.lerp=v,e.mapToColor=b,e.modifyHSL=function(t,e,r,n){if(t=f(t))return t=function(t){if(t){var e,r,n=t[0]/255,i=t[1]/255,a=t[2]/255,o=Math.min(n,i,a),s=Math.max(n,i,a),l=s-o,h=(s+o)/2;if(0===l)e=0,r=0;else{r=h<.5?l/(s+o):l/(2-s-o);var u=((s-n)/6+l/2)/l,c=((s-i)/6+l/2)/l,f=((s-a)/6+l/2)/l;n===s?e=f-c:i===s?e=1/3+u-f:a===s&&(e=2/3+c-u),e<0&&(e+=1),e>1&&(e-=1)}var d=[360*e,r,h];return null!=t[3]&&d.push(t[3]),d}}(t),null!=e&&(t[0]=function(t){return(t=Math.round(t))<0?0:t>360?360:t}(e)),null!=r&&(t[1]=o(r)),null!=n&&(t[2]=o(n)),g(d(t),"rgba")},e.modifyAlpha=function(t,e){if((t=f(t))&&null!=e)return t[3]=i(e),g(t,"rgba")},e.stringify=g},function(t,e){var r=function(){this.head=null,this.tail=null,this._len=0},n=r.prototype;n.insert=function(t){var e=new i(t);return this.insertEntry(e),e},n.insertEntry=function(t){this.head?(this.tail.next=t,t.prev=this.tail,t.next=null,this.tail=t):this.head=this.tail=t,this._len++},n.remove=function(t){var e=t.prev,r=t.next;e?e.next=r:this.head=r,r?r.prev=e:this.tail=e,t.next=t.prev=null,this._len--},n.len=function(){return this._len},n.clear=function(){this.head=this.tail=null,this._len=0};var i=function(t){this.value=t,this.next,this.prev},a=function(t){this._list=new r,this._map={},this._maxSize=t||10,this._lastRemovedEntry=null},o=a.prototype;o.put=function(t,e){var r=this._list,n=this._map,a=null;if(null==n[t]){var o=r.len(),s=this._lastRemovedEntry;if(o>=this._maxSize&&o>0){var l=r.head;r.remove(l),delete n[l.key],a=l.value,this._lastRemovedEntry=l}s?s.value=e:s=new i(e),s.key=t,r.insertEntry(s),n[t]=s}return a},o.get=function(t){var e=this._map[t],r=this._list;if(null!=e)return e!==r.tail&&(r.remove(e),r.insertEntry(e)),e.value},o.clear=function(){this._list.clear(),this._map={}};var s=a;t.exports=s},function(t,e){var r=1;"undefined"!=typeof window&&(r=Math.max(window.devicePixelRatio||1,1));var n=r;e.debugMode=0,e.devicePixelRatio=n},function(t,e,r){function n(t){if(t){t.font=w.makeFont(t);var e=t.textAlign;"middle"===e&&(e="center"),t.textAlign=null==e||A[e]?e:"left";var r=t.textVerticalAlign||t.textBaseline;"center"===r&&(r="middle"),t.textVerticalAlign=null==r||I[r]?r:"top",t.textPadding&&(t.textPadding=x(t.textPadding))}}function i(t,e,r,n,i){if(r&&e.textRotation){var a=e.textOrigin;"center"===a?(n=r.width/2+r.x,i=r.height/2+r.y):a&&(n=a[0]+r.x,i=a[1]+r.y),t.translate(n,i),t.rotate(-e.textRotation),t.translate(-n,-i)}}function a(t,e,r,n,i,a,l,h){var d=n.rich[r.styleName]||{};d.text=r.text;var v=r.textVerticalAlign,m=a+i/2;"top"===v?m=a+r.height/2:"bottom"===v&&(m=a+i-r.height/2),!r.isLineHolder&&o(d)&&s(t,e,d,"right"===h?l-r.width:"center"===h?l-r.width/2:l,m-r.height/2,r.width,r.height);var x=r.textPadding;x&&(l=p(l,h,x),m-=r.height/2-x[2]-r.textHeight/2),u(e,"shadowBlur",y(d.textShadowBlur,n.textShadowBlur,0)),u(e,"shadowColor",d.textShadowColor||n.textShadowColor||"transparent"),u(e,"shadowOffsetX",y(d.textShadowOffsetX,n.textShadowOffsetX,0)),u(e,"shadowOffsetY",y(d.textShadowOffsetY,n.textShadowOffsetY,0)),u(e,"textAlign",h),u(e,"textBaseline","middle"),u(e,"font",r.font||C);var _=c(d.textStroke||n.textStroke,w),b=f(d.textFill||n.textFill),w=g(d.textStrokeWidth,n.textStrokeWidth);_&&(u(e,"lineWidth",w),u(e,"strokeStyle",_),e.strokeText(r.text,l,m)),b&&(u(e,"fillStyle",b),e.fillText(r.text,l,m))}function o(t){return!!(t.textBackgroundColor||t.textBorderWidth&&t.textBorderColor)}function s(t,e,r,n,i,a,o){var s=r.textBackgroundColor,h=r.textBorderWidth,c=r.textBorderColor,f=_(s);if(u(e,"shadowBlur",r.textBoxShadowBlur||0),u(e,"shadowColor",r.textBoxShadowColor||"transparent"),u(e,"shadowOffsetX",r.textBoxShadowOffsetX||0),u(e,"shadowOffsetY",r.textBoxShadowOffsetY||0),f||h&&c){e.beginPath();var d=r.textBorderRadius;d?S.buildPath(e,{x:n,y:i,width:a,height:o,r:d}):e.rect(n,i,a,o),e.closePath()}if(f)if(u(e,"fillStyle",s),null!=r.fillOpacity){var p=e.globalAlpha;e.globalAlpha=r.fillOpacity*r.opacity,e.fill(),e.globalAlpha=p}else e.fill();else if(b(s)){var v=s.image;(v=T.createOrUpdateImage(v,null,t,l,s))&&T.isImageReady(v)&&e.drawImage(v,n,i,a,o)}if(h&&c)if(u(e,"lineWidth",h),u(e,"strokeStyle",c),null!=r.strokeOpacity){p=e.globalAlpha;e.globalAlpha=r.strokeOpacity*r.opacity,e.stroke(),e.globalAlpha=p}else e.stroke()}function l(t,e){e.image=t}function h(t,e,r){var n=e.x||0,i=e.y||0,a=e.textAlign,o=e.textVerticalAlign;if(r){var s=e.textPosition;if(s instanceof Array)n=r.x+d(s[0],r.width),i=r.y+d(s[1],r.height);else{var l=w.adjustTextPositionOnRect(s,r,e.textDistance);n=l.x,i=l.y,a=a||l.textAlign,o=o||l.textVerticalAlign}var h=e.textOffset;h&&(n+=h[0],i+=h[1])}return{baseX:n,baseY:i,textAlign:a,textVerticalAlign:o}}function u(t,e,r){return t[e]=M(t,e,r),t[e]}function c(t,e){return null==t||e<=0||"transparent"===t||"none"===t?null:t.image||t.colorStops?"#000":t}function f(t){return null==t||"none"===t?null:t.image||t.colorStops?"#000":t}function d(t,e){return"string"==typeof t?t.lastIndexOf("%")>=0?parseFloat(t)/100*e:parseFloat(t):t}function p(t,e,r){return"right"===e?t-r[1]:"center"===e?t+r[3]/2-r[1]/2:t+r[3]}var v=r(0),g=v.retrieve2,y=v.retrieve3,m=v.each,x=v.normalizeCssArray,_=v.isString,b=v.isObject,w=r(23),S=r(24),T=r(11),M=r(16),P=r(8),k=P.ContextCachedBy,O=P.WILL_BE_RESTORED,C=w.DEFAULT_FONT,A={left:1,right:1,center:1},I={top:1,bottom:1,middle:1},D=[["textShadowBlur","shadowBlur",0],["textShadowOffsetX","shadowOffsetX",0],["textShadowOffsetY","shadowOffsetY",0],["textShadowColor","shadowColor","transparent"]];e.normalizeTextStyle=function(t){return n(t),m(t.rich,n),t},e.renderText=function(t,e,r,n,l,u){n.rich?function(t,e,r,n,l,u){u!==O&&(e.__attrCachedBy=k.NONE);var c=t.__textCotentBlock;c&&!t.__dirtyText||(c=t.__textCotentBlock=w.parseRichText(r,n)),function(t,e,r,n,l){var u=r.width,c=r.outerWidth,f=r.outerHeight,d=n.textPadding,p=h(0,n,l),v=p.baseX,g=p.baseY,y=p.textAlign,m=p.textVerticalAlign;i(e,n,l,v,g);var x=w.adjustTextX(v,c,y),_=w.adjustTextY(g,f,m),b=x,S=_;d&&(b+=d[3],S+=d[0]);var T=b+u;o(n)&&s(t,e,n,x,_,c,f);for(var M=0;M<r.lines.length;M++){for(var P,k=r.lines[M],O=k.tokens,C=O.length,A=k.lineHeight,I=k.width,D=0,R=b,L=T,B=C-1;D<C&&(!(P=O[D]).textAlign||"left"===P.textAlign);)a(t,e,P,n,A,S,R,"left"),I-=P.width,R+=P.width,D++;for(;B>=0&&"right"===(P=O[B]).textAlign;)a(t,e,P,n,A,S,L,"right"),I-=P.width,L-=P.width,B--;for(R+=(u-(R-b)-(T-L)-I)/2;D<=B;)P=O[D],a(t,e,P,n,A,S,R+P.width/2,"center"),R+=P.width,D++;S+=A}}(t,e,c,n,l)}(t,e,r,n,l,u):function(t,e,r,n,a,l){"use strict";var u,d=o(n),v=!1,g=e.__attrCachedBy===k.PLAIN_TEXT;l!==O?(l&&(u=l.style,v=!d&&g&&u),e.__attrCachedBy=d?k.NONE:k.PLAIN_TEXT):g&&(e.__attrCachedBy=k.NONE);var y=n.font||C;v&&y===(u.font||C)||(e.font=y);var m=t.__computedFont;t.__styleFont!==y&&(t.__styleFont=y,m=t.__computedFont=e.font);var x=n.textPadding,_=n.textLineHeight,b=t.__textCotentBlock;b&&!t.__dirtyText||(b=t.__textCotentBlock=w.parsePlainText(r,m,x,_,n.truncate));var S=b.outerHeight,T=b.lines,P=b.lineHeight,A=h(0,n,a),I=A.baseX,R=A.baseY,L=A.textAlign||"left",B=A.textVerticalAlign;i(e,n,a,I,R);var E=w.adjustTextY(R,S,B),F=I,z=E;if(d||x){var N=w.getWidth(r,m),W=N;x&&(W+=x[1]+x[3]);var q=w.adjustTextX(I,W,L);d&&s(t,e,n,q,E,W,S),x&&(F=p(I,L,x),z+=x[0])}e.textAlign=L,e.textBaseline="middle",e.globalAlpha=n.opacity||1;for(var j=0;j<D.length;j++){var H=D[j],Y=H[0],U=H[1],V=n[Y];v&&V===u[Y]||(e[U]=M(e,U,V||H[2]))}z+=P/2;var G=n.textStrokeWidth,X=v?u.textStrokeWidth:null,Z=!v||G!==X,Q=!v||Z||n.textStroke!==u.textStroke,$=c(n.textStroke,G),K=f(n.textFill);if($&&(Z&&(e.lineWidth=G),Q&&(e.strokeStyle=$)),K&&(v&&n.textFill===u.textFill||(e.fillStyle=K)),1===T.length)$&&e.strokeText(T[0],F,z),K&&e.fillText(T[0],F,z);else for(var j=0;j<T.length;j++)$&&e.strokeText(T[j],F,z),K&&e.fillText(T[j],F,z),z+=P}(t,e,r,n,l,u)},e.getStroke=c,e.getFill=f,e.needDrawText=function(t,e){return null!=t&&(t||e.textBackgroundColor||e.textBorderWidth&&e.textBorderColor||e.textPadding)}},function(t,e,r){function n(t,e){var r=t+":"+(e=e||C);if(M[r])return M[r];for(var n=(t+"").split("\n"),i=0,a=0,o=n.length;a<o;a++)i=Math.max(d(n[a],e).width,i);return P>k&&(P=0,M={}),P++,M[r]=i,i}function i(t,e,r,i,a,l,h){var u=p(t,e,a,l,h),c=n(t,e);a&&(c+=a[1]+a[3]);var f=u.outerHeight,d=o(0,c,r),v=s(0,f,i),g=new y(d,v,c,f);return g.lineHeight=u.lineHeight,g}function a(t,e,r,n,i,a,l,h){var u=v(t,{rich:l,truncate:h,font:e,textAlign:r,textPadding:i,textLineHeight:a}),c=u.outerWidth,f=u.outerHeight,d=o(0,c,r),p=s(0,f,n);return new y(d,p,c,f)}function o(t,e,r){return"right"===r?t-=e:"center"===r&&(t-=e/2),t}function s(t,e,r){return"middle"===r?t-=e/2:"bottom"===r&&(t-=e),t}function l(t,e,r,n,i){if(!e)return"";var a=(t+"").split("\n");i=h(e,r,n,i);for(var o=0,s=a.length;o<s;o++)a[o]=u(a[o],i);return a.join("\n")}function h(t,e,r,i){(i=b({},i)).font=e;r=w(r,"...");i.maxIterations=w(i.maxIterations,2);var a=i.minChar=w(i.minChar,0);i.cnCharWidth=n("国",e);var o=i.ascCharWidth=n("a",e);i.placeholder=w(i.placeholder,"");for(var s=t=Math.max(0,t-1),l=0;l<a&&s>=o;l++)s-=o;var h=n(r,e);return h>s&&(r="",h=0),s=t-h,i.ellipsis=r,i.ellipsisWidth=h,i.contentWidth=s,i.containerWidth=t,i}function u(t,e){var r=e.containerWidth,i=e.font,a=e.contentWidth;if(!r)return"";var o=n(t,i);if(o<=r)return t;for(var s=0;;s++){if(o<=a||s>=e.maxIterations){t+=e.ellipsis;break}var l=0===s?c(t,a,e.ascCharWidth,e.cnCharWidth):o>0?Math.floor(t.length*a/o):0;o=n(t=t.substr(0,l),i)}return""===t&&(t=e.placeholder),t}function c(t,e,r,n){for(var i=0,a=0,o=t.length;a<o&&i<e;a++){var s=t.charCodeAt(a);i+=0<=s&&s<=127?r:n}return a}function f(t){return n("国",t)}function d(t,e){return A.measureText(t,e)}function p(t,e,r,n,i){null!=t&&(t+="");var a=w(n,f(e)),o=t?t.split("\n"):[],s=o.length*a,l=s;if(r&&(l+=r[0]+r[2]),t&&i){var c=i.outerHeight,d=i.outerWidth;if(null!=c&&l>c)t="",o=[];else if(null!=d)for(var p=h(d-(r?r[1]+r[3]:0),e,i.ellipsis,{minChar:i.minChar,placeholder:i.placeholder}),v=0,g=o.length;v<g;v++)o[v]=u(o[v],p)}return{lines:o,height:s,outerHeight:l,lineHeight:a}}function v(t,e){var r={lines:[],width:0,height:0};if(null!=t&&(t+=""),!t)return r;for(var i,a=O.lastIndex=0;null!=(i=O.exec(t));){var o=i.index;o>a&&g(r,t.substring(a,o)),g(r,i[2],i[1]),a=O.lastIndex}a<t.length&&g(r,t.substring(a,t.length));var s=r.lines,h=0,u=0,c=[],d=e.textPadding,p=e.truncate,v=p&&p.outerWidth,y=p&&p.outerHeight;d&&(null!=v&&(v-=d[1]+d[3]),null!=y&&(y-=d[0]+d[2]));for(var x=0;x<s.length;x++){for(var _=s[x],b=0,T=0,M=0;M<_.tokens.length;M++){var P=(F=_.tokens[M]).styleName&&e.rich[F.styleName]||{},k=F.textPadding=P.textPadding,C=F.font=P.font||e.font,A=F.textHeight=w(P.textHeight,f(C));if(k&&(A+=k[0]+k[2]),F.height=A,F.lineHeight=S(P.textLineHeight,e.textLineHeight,A),F.textAlign=P&&P.textAlign||e.textAlign,F.textVerticalAlign=P&&P.textVerticalAlign||"middle",null!=y&&h+F.lineHeight>y)return{lines:[],width:0,height:0};F.textWidth=n(F.text,C);var I=P.textWidth,D=null==I||"auto"===I;if("string"==typeof I&&"%"===I.charAt(I.length-1))F.percentWidth=I,c.push(F),I=0;else{if(D){I=F.textWidth;var R=P.textBackgroundColor,L=R&&R.image;L&&(L=m.findExistImage(L),m.isImageReady(L)&&(I=Math.max(I,L.width*A/L.height)))}var B=k?k[1]+k[3]:0;I+=B;var E=null!=v?v-T:null;null!=E&&E<I&&(!D||E<B?(F.text="",F.textWidth=I=0):(F.text=l(F.text,E-B,C,p.ellipsis,{minChar:p.minChar}),F.textWidth=n(F.text,C),I=F.textWidth+B))}T+=F.width=I,P&&(b=Math.max(b,F.lineHeight))}_.width=T,_.lineHeight=b,h+=b,u=Math.max(u,T)}r.outerWidth=r.width=w(e.textWidth,u),r.outerHeight=r.height=w(e.textHeight,h),d&&(r.outerWidth+=d[1]+d[3],r.outerHeight+=d[0]+d[2]);for(x=0;x<c.length;x++){var F,z=(F=c[x]).percentWidth;F.width=parseInt(z,10)/100*u}return r}function g(t,e,r){for(var n=""===e,i=e.split("\n"),a=t.lines,o=0;o<i.length;o++){var s=i[o],l={styleName:r,text:s,isLineHolder:!s&&!n};if(o)a.push({tokens:[l]});else{var h=(a[a.length-1]||(a[0]={tokens:[]})).tokens,u=h.length;1===u&&h[0].isLineHolder?h[0]=l:(s||!u||n)&&h.push(l)}}}var y=r(3),m=r(11),x=r(0),_=x.getContext,b=x.extend,w=x.retrieve2,S=x.retrieve3,T=x.trim,M={},P=0,k=5e3,O=/\{([a-zA-Z0-9_]+)\|([^}]*)\}/g,C="12px sans-serif",A={measureText:function(t,e){var r=_();return r.font=e||C,r.measureText(t)}};e.DEFAULT_FONT=C,e.$override=function(t,e){A[t]=e},e.getWidth=n,e.getBoundingRect=function(t,e,r,n,o,s,l,h){return l?a(t,e,r,n,o,s,l,h):i(t,e,r,n,o,s,h)},e.adjustTextX=o,e.adjustTextY=s,e.adjustTextPositionOnRect=function(t,e,r){var n=e.x,i=e.y,a=e.height,o=e.width,s=a/2,l="left",h="top";switch(t){case"left":n-=r,i+=s,l="right",h="middle";break;case"right":n+=r+o,i+=s,h="middle";break;case"top":n+=o/2,i-=r,l="center",h="bottom";break;case"bottom":n+=o/2,i+=a+r,l="center";break;case"inside":n+=o/2,i+=s,l="center",h="middle";break;case"insideLeft":n+=r,i+=s,h="middle";break;case"insideRight":n+=o-r,i+=s,l="right",h="middle";break;case"insideTop":n+=o/2,i+=r,l="center";break;case"insideBottom":n+=o/2,i+=a-r,l="center",h="bottom";break;case"insideTopLeft":n+=r,i+=r;break;case"insideTopRight":n+=o-r,i+=r,l="right";break;case"insideBottomLeft":n+=r,i+=a-r,h="bottom";break;case"insideBottomRight":n+=o-r,i+=a-r,l="right",h="bottom"}return{x:n,y:i,textAlign:l,textVerticalAlign:h}},e.truncateText=l,e.getLineHeight=f,e.measureText=d,e.parsePlainText=p,e.parseRichText=v,e.makeFont=function(t){var e=(t.fontSize||t.fontFamily)&&[t.fontStyle,t.fontWeight,(t.fontSize||12)+"px",t.fontFamily||"sans-serif"].join(" ");return e&&T(e)||t.textFont||t.font}},function(t,e){e.buildPath=function(t,e){var r,n,i,a,o,s=e.x,l=e.y,h=e.width,u=e.height,c=e.r;h<0&&(s+=h,h=-h),u<0&&(l+=u,u=-u),"number"==typeof c?r=n=i=a=c:c instanceof Array?1===c.length?r=n=i=a=c[0]:2===c.length?(r=i=c[0],n=a=c[1]):3===c.length?(r=c[0],n=a=c[1],i=c[2]):(r=c[0],n=c[1],i=c[2],a=c[3]):r=n=i=a=0,r+n>h&&(r*=h/(o=r+n),n*=h/o),i+a>h&&(i*=h/(o=i+a),a*=h/o),n+i>u&&(n*=u/(o=n+i),i*=u/o),r+a>u&&(r*=u/(o=r+a),a*=u/o),t.moveTo(s+r,l),t.lineTo(s+h-n,l),0!==n&&t.arc(s+h-n,l+n,n,-Math.PI/2,0),t.lineTo(s+h,l+u-i),0!==i&&t.arc(s+h-i,l+u-i,i,0,Math.PI/2),t.lineTo(s+a,l+u),0!==a&&t.arc(s+a,l+u-a,a,Math.PI/2,Math.PI),t.lineTo(s,l+r),0!==r&&t.arc(s+r,l+r,r,Math.PI,1.5*Math.PI)}},function(t,e){var r=2*Math.PI;e.normalizeRadian=function(t){return(t%=r)<0&&(t+=r),t}},function(t,e,r){var n=r(68),i=r(69);e.buildPath=function(t,e,r){var a=e.points,o=e.smooth;if(a&&a.length>=2){if(o&&"spline"!==o){var s=i(a,o,r,e.smoothConstraint);t.moveTo(a[0][0],a[0][1]);for(var l=a.length,h=0;h<(r?l:l-1);h++){var u=s[2*h],c=s[2*h+1],f=a[(h+1)%l];t.bezierCurveTo(u[0],u[1],c[0],c[1],f[0],f[1])}}else{"spline"===o&&(a=n(a,r)),t.moveTo(a[0][0],a[0][1]),h=1;for(var d=a.length;h<d;h++)t.lineTo(a[h][0],a[h][1])}r&&t.closePath()}}},function(t,e){function r(t,e,r){var i=n(2*t);return(i+n(e))%2==0?i/2:(i+(r?1:-1))/2}var n=Math.round;e.subPixelOptimizeLine=function(t,e,i){var a=i&&i.lineWidth;if(e&&a){var o=e.x1,s=e.x2,l=e.y1,h=e.y2;n(2*o)===n(2*s)?t.x1=t.x2=r(o,a,!0):(t.x1=o,t.x2=s),n(2*l)===n(2*h)?t.y1=t.y2=r(l,a,!0):(t.y1=l,t.y2=h)}},e.subPixelOptimizeRect=function(t,e,n){var i=n&&n.lineWidth;if(e&&i){var a=e.x,o=e.y,s=e.width,l=e.height;t.x=r(a,i,!0),t.y=r(o,i,!0),t.width=Math.max(r(a+s,i,!1)-t.x,0===s?0:1),t.height=Math.max(r(o+l,i,!1)-t.y,0===l?0:1)}},e.subPixelOptimize=r},function(t,e){var r=function(t){this.colorStops=t||[]};r.prototype={constructor:r,addColorStop:function(t,e){this.colorStops.push({offset:t,color:e})}};var n=r;t.exports=n},function(t,e,r){t.exports=r(30)},function(t,e,r){var n=r(5);r(31),r(38),n.registerVisual(n.util.curry(r(80),"liquidFill"))},function(t,e,r){var n=r(32),i=r(5);i.extendSeriesModel({type:"series.liquidFill",visualColorAccessPath:"textStyle.normal.color",optionUpdated:function(){var t=this.option;t.gridSize=Math.max(Math.floor(t.gridSize),4)},getInitialData:function(t,e){var r=n(["value"],t.data),a=new i.List(r,this);return a.initData(t.data),a},defaultOption:{color:["#294D99","#156ACF","#1598ED","#45BDFF"],center:["50%","50%"],radius:"50%",amplitude:"8%",waveLength:"80%",phase:"auto",period:"auto",direction:"right",shape:"circle",waveAnimation:!0,animationEasing:"linear",animationEasingUpdate:"linear",animationDuration:2e3,animationDurationUpdate:1e3,outline:{show:!0,borderDistance:8,itemStyle:{color:"none",borderColor:"#294D99",borderWidth:8,shadowBlur:20,shadowColor:"rgba(0, 0, 0, 0.25)"}},backgroundStyle:{color:"#E3F7FF"},itemStyle:{opacity:.95,shadowBlur:50,shadowColor:"rgba(0, 0, 0, 0.4)"},label:{show:!0,color:"#294D99",insideColor:"#fff",fontSize:50,fontWeight:"bold",align:"center",baseline:"middle",position:"inside"},emphasis:{itemStyle:{opacity:.8}}}})},function(t,e,r){function n(t,e,r){if(r||null!=e.get(t)){for(var n=0;null!=e.get(t+n);)n++;t+=n}return e.set(t,!0),t}var i=r(0),a=i.createHashMap,o=i.each,s=i.isString,l=i.defaults,h=i.extend,u=i.isObject,c=i.clone,f=r(12).normalizeToArray,d=r(33).guessOrdinal,p=r(14),v=r(37).OTHER_DIMENSIONS,g=function(t,e,r){function i(t,e,r){null!=v.get(e)?t.otherDims[e]=r:(t.coordDim=e,t.coordDimIndex=r,x.set(e,!0))}p.isInstance(e)||(e=p.seriesDataToSource(e)),r=r||{},t=(t||[]).slice();for(var g=(r.dimsDef||[]).slice(),y=a(r.encodeDef),m=a(),x=a(),_=[],b=function(t,e,r,n){var i=Math.max(t.dimensionsDetectCount||1,e.length,r.length,n||0);return o(e,function(t){var e=t.dimsDef;e&&(i=Math.max(i,e.length))}),i}(e,t,g,r.dimCount),w=0;w<b;w++){var S=g[w]=h({},u(g[w])?g[w]:{name:g[w]}),T=S.name,M=_[w]={otherDims:{}};null!=T&&null==m.get(T)&&(M.name=M.displayName=T,m.set(T,w)),null!=S.type&&(M.type=S.type),null!=S.displayName&&(M.displayName=S.displayName)}y.each(function(t,e){if(1===(t=f(t).slice()).length&&t[0]<0)y.set(e,!1);else{var r=y.set(e,[]);o(t,function(t,n){s(t)&&(t=m.get(t)),null!=t&&t<b&&(r[n]=t,i(_[t],e,n))})}});var P=0;o(t,function(t,e){var r,n,a;if(s(t))r=t,t={};else{r=t.name;var h=t.ordinalMeta;t.ordinalMeta=null,(t=c(t)).ordinalMeta=h,n=t.dimsDef,a=t.otherDims,t.name=t.coordDim=t.coordDimIndex=t.dimsDef=t.otherDims=null}if(!1!==(d=y.get(r))){var d;if(!(d=f(d)).length)for(var p=0;p<(n&&n.length||1);p++){for(;P<_.length&&null!=_[P].coordDim;)P++;P<_.length&&d.push(P++)}o(d,function(e,o){var s=_[e];if(i(l(s,t),r,o),null==s.name&&n){var h=n[o];!u(h)&&(h={name:h}),s.name=s.displayName=h.name,s.defaultTooltip=h.defaultTooltip}a&&l(s.otherDims,a)})}});var k=r.generateCoord,O=r.generateCoordCount,C=null!=O;O=k?O||1:0;for(var A=k||"value",I=0;I<b;I++)null==(M=_[I]=_[I]||{}).coordDim&&(M.coordDim=n(A,x,C),M.coordDimIndex=0,(!k||O<=0)&&(M.isExtraCoord=!0),O--),null==M.name&&(M.name=n(M.coordDim,m)),null==M.type&&d(e,I,M.name)&&(M.type="ordinal");return _};t.exports=g},function(t,e,r){function n(t,e,r,n,o){if(!t)return{dimensionsDefine:i(o)};var s,l,h,c;if(e===M)"auto"===n||null==n?a(function(t){null!=t&&"-"!==t&&(y(t)?null==l&&(l=1):l=0)},r,t,10):l=n?1:0,o||1!==l||(o=[],a(function(t,e){o[e]=null!=t?t:""},r,t)),s=o?o.length:r===A?t.length:t[0]?t[0].length:null;else if(e===P)o||(o=function(t){for(var e,r=0;r<t.length&&!(e=t[r++]););if(e){var n=[];return p(e,function(t,e){n.push(e)}),n}}(t),h=!0);else if(e===k)o||(o=[],h=!0,p(t,function(t,e){o.push(e)}));else if(e===T){var f=u(t[0]);s=g(f)&&f.length||1}return h&&p(o,function(t,e){"name"===(m(t)?t.name:t)&&(c=e)}),{startIndex:l,dimensionsDefine:i(o),dimensionsDetectCount:s,potentialNameDimIndex:c}}function i(t){if(t){var e=d();return v(t,function(t,r){if(null==(t=b({},m(t)?t:{name:t})).name)return t;t.name+="",null==t.displayName&&(t.displayName=t.name);var n=e.get(t.name);return n?t.name+="-"+n.count++:e.set(t.name,{count:1}),t})}}function a(t,e,r,n){if(null==n&&(n=1/0),e===A)for(var i=0;i<r.length&&i<n;i++)t(r[i]?r[i][0]:null,i);else{var a=r[0]||[];for(i=0;i<a.length&&i<n;i++)t(a[i],i)}}function o(t,e,r,n,i,a){var o=c(t),l={},h=[],u=[],f=t.subType,v=d(["pie","map","funnel"]),g=d(["line","bar","pictorialBar","scatter","effectScatter","candlestick","boxplot"]);if(o&&null!=g.get(f)){var y=t.ecModel,m=I(y).datasetMap,x=e.uid+"_"+i,_=m.get(x)||m.set(x,{categoryWayDim:1,valueWayDim:0});p(o.coordSysDims,function(t){if(null==o.firstCategoryDimIndex){var e=_.valueWayDim++;l[t]=e,u.push(e)}else if(o.categoryAxisMap.get(t))l[t]=0,h.push(0);else{e=_.categoryWayDim++;l[t]=e,u.push(e)}})}else if(null!=v.get(f)){for(var b,w=0;w<5&&null==b;w++)s(r,n,i,a.dimensionsDefine,a.startIndex,w)||(b=w);if(null!=b){l.value=b;var S=a.potentialNameDimIndex||Math.max(b-1,0);u.push(S),h.push(S)}}return h.length&&(l.itemName=h),u.length&&(l.seriesName=u),l}function s(t,e,r,n,i,a){function o(t){return(null==t||!isFinite(t)||""===t)&&(!(!y(t)||"-"===t)||void 0)}var s,l;if(x(t))return!1;if(n&&(l=n[a],l=m(l)?l.name:l),e===M)if(r===A){for(var h=t[a],c=0;c<(h||[]).length&&c<5;c++)if(null!=(s=o(h[i+c])))return s}else for(c=0;c<t.length&&c<5;c++){var f=t[i+c];if(f&&null!=(s=o(f[a])))return s}else if(e===P){if(!l)return;for(c=0;c<t.length&&c<5;c++){if((d=t[c])&&null!=(s=o(d[l])))return s}}else if(e===k){if(!l)return;if(!(h=t[l])||x(h))return!1;for(c=0;c<h.length&&c<5;c++)if(null!=(s=o(h[c])))return s}else if(e===T)for(c=0;c<t.length&&c<5;c++){var d=t[c],p=u(d);if(!g(p))return!1;if(null!=(s=o(p[a])))return s}return!1}var l=(r(6).__DEV__,r(12)),h=l.makeInner,u=l.getDataItemValue,c=r(35).getCoordSysDefineBySeries,f=r(0),d=f.createHashMap,p=f.each,v=f.map,g=f.isArray,y=f.isString,m=f.isObject,x=f.isTypedArray,_=f.isArrayLike,b=f.extend,w=(f.assert,r(14)),S=r(15),T=S.SOURCE_FORMAT_ORIGINAL,M=S.SOURCE_FORMAT_ARRAY_ROWS,P=S.SOURCE_FORMAT_OBJECT_ROWS,k=S.SOURCE_FORMAT_KEYED_COLUMNS,O=S.SOURCE_FORMAT_UNKNOWN,C=S.SOURCE_FORMAT_TYPED_ARRAY,A=S.SERIES_LAYOUT_BY_ROW,I=h();e.detectSourceFormat=function(t){var e=t.option.source,r=O;if(x(e))r=C;else if(g(e)){0===e.length&&(r=M);for(var n=0,i=e.length;n<i;n++){var a=e[n];if(null!=a){if(g(a)){r=M;break}if(m(a)){r=P;break}}}}else if(m(e)){for(var o in e)if(e.hasOwnProperty(o)&&_(e[o])){r=k;break}}else if(null!=e)throw new Error("Invalid data");I(t).sourceFormat=r},e.getSource=function(t){return I(t).source},e.resetSourceDefaulter=function(t){I(t).datasetMap=d()},e.prepareSource=function(t){var e=t.option,r=e.data,i=x(r)?C:T,a=!1,s=e.seriesLayoutBy,l=e.sourceHeader,h=e.dimensions,u=function(t){var e=t.option;if(!e.data)return t.ecModel.getComponent("dataset",e.datasetIndex||0)}(t);if(u){var c=u.option;r=c.source,i=I(u).sourceFormat,a=!0,s=s||c.seriesLayoutBy,null==l&&(l=c.sourceHeader),h=h||c.dimensions}var f=n(r,i,s,l,h),d=e.encode;!d&&u&&(d=o(t,u,r,i,s,f)),I(t).source=new w({data:r,fromDataset:a,seriesLayoutBy:s,sourceFormat:i,dimensionsDefine:f.dimensionsDefine,startIndex:f.startIndex,dimensionsDetectCount:f.dimensionsDetectCount,encodeDefine:d})},e.guessOrdinal=function(t,e){return s(t.data,t.sourceFormat,t.seriesLayoutBy,t.dimensionsDefine,t.startIndex,e)}},function(t,e){var r;r=function(){return this}();try{r=r||Function("return this")()||(0,eval)("this")}catch(t){"object"==typeof window&&(r=window)}t.exports=r},function(t,e,r){function n(t){return"category"===t.get("type")}var i=(r(6).__DEV__,r(0)),a=i.createHashMap,o=(i.retrieve,i.each),s={cartesian2d:function(t,e,r,i){var a=t.getReferringComponents("xAxis")[0],o=t.getReferringComponents("yAxis")[0];e.coordSysDims=["x","y"],r.set("x",a),r.set("y",o),n(a)&&(i.set("x",a),e.firstCategoryDimIndex=0),n(o)&&(i.set("y",o),e.firstCategoryDimIndex=1)},singleAxis:function(t,e,r,i){var a=t.getReferringComponents("singleAxis")[0];e.coordSysDims=["single"],r.set("single",a),n(a)&&(i.set("single",a),e.firstCategoryDimIndex=0)},polar:function(t,e,r,i){var a=t.getReferringComponents("polar")[0],o=a.findAxisModel("radiusAxis"),s=a.findAxisModel("angleAxis");e.coordSysDims=["radius","angle"],r.set("radius",o),r.set("angle",s),n(o)&&(i.set("radius",o),e.firstCategoryDimIndex=0),n(s)&&(i.set("angle",s),e.firstCategoryDimIndex=1)},geo:function(t,e,r,n){e.coordSysDims=["lng","lat"]},parallel:function(t,e,r,i){var a=t.ecModel,s=a.getComponent("parallel",t.get("parallelIndex")),l=e.coordSysDims=s.dimensions.slice();o(s.parallelAxisIndex,function(t,o){var s=a.getComponent("parallelAxis",t),h=l[o];r.set(h,s),n(s)&&null==e.firstCategoryDimIndex&&(i.set(h,s),e.firstCategoryDimIndex=o)})}};e.getCoordSysDefineBySeries=function(t){var e=t.get("coordinateSystem"),r={coordSysName:e,coordSysDims:[],axisMap:a(),categoryAxisMap:a()},n=s[e];if(n)return n(t,r,r.axisMap,r.categoryAxisMap),r}},function(t,e,r){function n(t){var e={main:"",sub:""};return t&&(t=t.split(s),e.main=t[0]||"",e.sub=t[1]||""),e}function i(t,e){var r=o.slice(arguments,2);return this.superClass.prototype[e].apply(t,r)}function a(t,e,r){return this.superClass.prototype[e].apply(t,r)}var o=(r(6).__DEV__,r(0)),s=".",l="___EC__COMPONENT__CONTAINER___",h=0;e.parseClassType=n,e.enableClassExtend=function(t,e){t.$constructor=t,t.extend=function(t){var e=this,r=function(){t.$constructor?t.$constructor.apply(this,arguments):e.apply(this,arguments)};return o.extend(r.prototype,t),r.extend=this.extend,r.superCall=i,r.superApply=a,o.inherits(r,this),r.superClass=e,r}},e.enableClassCheck=function(t){var e=["__\0is_clz",h++,Math.random().toFixed(3)].join("_");t.prototype[e]=!0,t.isInstance=function(t){return!(!t||!t[e])}},e.enableClassManagement=function(t,e){e=e||{};var r={};if(t.registerClass=function(t,e){return e&&(function(t){o.assert(/^[a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)?$/.test(t),'componentType "'+t+'" illegal')}(e),(e=n(e)).sub?e.sub!==l&&((function(t){var e=r[t.main];return e&&e[l]||((e=r[t.main]={})[l]=!0),e}(e))[e.sub]=t):r[e.main]=t),t},t.getClass=function(t,e,n){var i=r[t];if(i&&i[l]&&(i=e?i[e]:null),n&&!i)throw new Error(e?"Component "+t+"."+(e||"")+" not exists. Load it first.":t+".type should be specified.");return i},t.getClassesByMainType=function(t){t=n(t);var e=[],i=r[t.main];return i&&i[l]?o.each(i,function(t,r){r!==l&&e.push(t)}):e.push(i),e},t.hasClass=function(t){return t=n(t),!!r[t.main]},t.getAllClassMainTypes=function(){var t=[];return o.each(r,function(e,r){t.push(r)}),t},t.hasSubTypes=function(t){t=n(t);var e=r[t.main];return e&&e[l]},t.parseClassType=n,e.registerWhenExtend){var i=t.extend;i&&(t.extend=function(e){var r=i.call(this,e);return t.registerClass(r,e.type)})}return t},e.setReadOnly=function(t,e){}},function(t,e,r){var n=r(0),i=n.each,a=n.createHashMap,o=((n.assert,r(6)).__DEV__,a(["tooltip","label","itemName","itemId","seriesName"]));e.OTHER_DIMENSIONS=o,e.summarizeDimensions=function(t){var e={},r=e.encode={},n=a(),s=[],l=[];i(t.dimensions,function(e){var i=t.getDimensionInfo(e),a=i.coordDim;if(a){var h=r[a];r.hasOwnProperty(a)||(h=r[a]=[]),h[i.coordDimIndex]=e,i.isExtraCoord||(n.set(a,1),function(t){return!("ordinal"===t||"time"===t)}(i.type)&&(s[0]=e)),i.defaultTooltip&&l.push(e)}o.each(function(t,e){var n=r[e];r.hasOwnProperty(e)||(n=r[e]=[]);var a=i.otherDims[e];null!=a&&!1!==a&&(n[a]=i.name)})});var h=[],u={};n.each(function(t,e){var n=r[e];u[e]=n[0],h=h.concat(n)}),e.dataDimsOnCoord=h,e.encodeFirstDimNotExtra=u;var c=r.label;c&&c.length&&(s=c.slice());var f=r.tooltip;return f&&f.length?l=f.slice():l.length||(l=s.slice()),r.defaultedLabel=s,r.defaultedTooltip=l,e},e.getDimensionTypeByAxis=function(t){return"category"===t?"ordinal":"time"===t?"time":"float"}},function(t,e,r){var n=r(5),i=n.number,a=r(39),o=i.parsePercent,s=r(79);n.extendChartView({type:"liquidFill",render:function(t,e,r){function i(t,e){if(O){if(0===O.indexOf("path://")){var r=n.graphic.makePath(O.slice(7),{}),i=r.getBoundingRect(),o=i.width,s=i.height;o>s?(s*=2*t/o,o=2*t):(o*=2*t/s,s=2*t);var l=e?0:M-o/2,h=e?0:P-s/2;return r=n.graphic.makePath(O.slice(7),{},new n.graphic.BoundingRect(l,h,o,s)),e&&(r.position=[-o/2,-s/2]),r}if(k){var u=e?-t[0]:M-t[0],c=e?-t[1]:P-t[1];return a.createSymbol("rect",u,c,2*t[0],2*t[1])}u=e?-t:M-t,c=e?-t:P-t;return"pin"===O?c+=t:"arrow"===O&&(c-=t),a.createSymbol(O,u,c,2*t,2*t)}return new n.graphic.Circle({shape:{cx:e?0:M,cy:e?0:P,r:t}})}function l(){var e=i(w);return e.style.fill=null,e.setStyle(t.getModel("outline.itemStyle").getItemStyle()),e}function h(e,r,a){var l=k?v[0]:v,h=k?y/2:v,u=f.getItemModel(e),c=u.getModel("itemStyle"),d=u.get("phase"),p=o(u.get("amplitude"),2*h),g=o(u.get("waveLength"),2*l),m=h-f.get("value",e)*h*2;d=a?a.shape.phase:"auto"===d?e*Math.PI/4:d;var x=c.getItemStyle();if(!x.fill){var _=t.get("color"),b=e%_.length;x.fill=_[b]}var w=new s({shape:{waveLength:g,radius:l,radiusY:h,cx:2*l,cy:0,waterLevel:m,amplitude:p,phase:d,inverse:r},style:x,position:[M,P]});w.shape._waterLevel=m;var S=u.getModel("emphasis.itemStyle").getItemStyle();S.lineWidth=0,n.graphic.setHoverStyle(w,S);var T=i(v,!0);return T.setStyle({fill:"white"}),w.setClipPath(T),w}function u(t,e,r){var n=f.getItemModel(t),i=n.get("period"),a=n.get("direction"),o=f.get("value",t),s=n.get("phase");s=r?r.shape.phase:"auto"===s?t*Math.PI/4:s;var l;l="auto"===i?function(e){var r=f.count();return 0===r?e:e*(.2+(r-t)/r*.8)}(5e3):"function"==typeof i?i(o,t):i;var h=0;"right"===a||null==a?h=Math.PI:"left"===a?h=-Math.PI:"none"===a?h=0:console.error("Illegal direction value for liquid fill."),"none"!==a&&n.get("waveAnimation")&&e.animate("shape",!0).when(0,{phase:s}).when(l/2,{phase:h+s}).when(l,{phase:2*h+s}).during(function(){I&&I.dirty(!0)}).start()}var c=this.group;c.removeAll();var f=t.getData(),d=f.getItemModel(0),p=d.get("center"),v=d.get("radius"),g=r.getWidth(),y=r.getHeight(),m=Math.min(g,y),x=0,_=0,b=t.get("outline.show");b&&(x=t.get("outline.borderDistance"),_=o(t.get("outline.itemStyle.borderWidth"),m));var w,S,T,M=o(p[0],g),P=o(p[1],y),k=!1,O=t.get("shape");("container"===O?(k=!0,S=[(w=[g/2,y/2])[0]-_/2,w[1]-_/2],T=[o(x,g),o(x,y)],v=[Math.max(S[0]-T[0],0),Math.max(S[1]-T[1],0)]):(S=(w=o(v,m)/2)-_/2,T=o(x,m),v=Math.max(S-T,0)),b)&&(l().style.lineWidth=_,c.add(l()));var C=k?0:M-v,A=k?0:P-v,I=null;c.add(function(){var e=i(v);e.setStyle(t.getModel("backgroundStyle").getItemStyle()),e.style.fill=null,e.z2=5;var r=i(v);r.setStyle(t.getModel("backgroundStyle").getItemStyle()),r.style.stroke=null;var a=new n.graphic.Group;return a.add(e),a.add(r),a}());var D=this._data,R=[];f.diff(D).add(function(e){var r=h(e,!1),i=r.shape.waterLevel;r.shape.waterLevel=k?y/2:v,n.graphic.initProps(r,{shape:{waterLevel:i}},t),r.z2=2,u(e,r,null),c.add(r),f.setItemGraphicEl(e,r),R.push(r)}).update(function(e,r){for(var i=D.getItemGraphicEl(r),a=h(e,!1,i),o={},s=["amplitude","cx","cy","phase","radius","radiusY","waterLevel","waveLength"],l=0;l<s.length;++l){var d=s[l];a.shape.hasOwnProperty(d)&&(o[d]=a.shape[d])}var p={},v=["fill","opacity","shadowBlur","shadowColor"];for(l=0;l<v.length;++l){d=v[l];a.style.hasOwnProperty(d)&&(p[d]=a.style[d])}k&&(o.radiusY=y/2),n.graphic.updateProps(i,{shape:o,style:p},t),i.position=a.position,i.setClipPath(a.clipPath),i.shape.inverse=a.inverse,u(e,i,i),c.add(i),f.setItemGraphicEl(e,i),R.push(i)}).remove(function(t){var e=D.getItemGraphicEl(t);c.remove(e)}).execute(),d.get("label.show")&&c.add(function(e){var r=d.getModel("label"),a={z2:10,shape:{x:C,y:A,width:2*(k?v[0]:v),height:2*(k?v[1]:v)},style:{fill:"transparent",text:function(){var e=t.getFormattedLabel(0,"normal"),r=100*f.get("value",0),n=f.getName(0)||t.name;return isNaN(r)||(n=r.toFixed(0)+"%"),null==e?n:e}(),textAlign:r.get("align"),textVerticalAlign:r.get("baseline")},silent:!0},o=new n.graphic.Rect(a),s=r.get("color");n.graphic.setText(o.style,r,s);var l=new n.graphic.Rect(a),h=r.get("insideColor");n.graphic.setText(l.style,r,h),l.style.textFill=h;var u=new n.graphic.Group;u.add(o),u.add(l);var c=i(v,!0);return(I=new n.graphic.CompoundPath({shape:{paths:e},position:[M,P]})).setClipPath(c),l.setClipPath(I),u}(R)),this._data=f},dispose:function(){}})},function(t,e,r){function n(t,e){if("image"!==this.type){var r=this.style,n=this.shape;n&&"line"===n.symbolType?r.stroke=t:this.__isEmptyBrush?(r.stroke=t,r.fill=e||"#fff"):(r.fill&&(r.fill=t),r.stroke&&(r.stroke=t)),this.dirty(!1)}}var i=r(0),a=r(40),o=r(3),s=a.extendShape({type:"triangle",shape:{cx:0,cy:0,width:0,height:0},buildPath:function(t,e){var r=e.cx,n=e.cy,i=e.width/2,a=e.height/2;t.moveTo(r,n-a),t.lineTo(r+i,n+a),t.lineTo(r-i,n+a),t.closePath()}}),l=a.extendShape({type:"diamond",shape:{cx:0,cy:0,width:0,height:0},buildPath:function(t,e){var r=e.cx,n=e.cy,i=e.width/2,a=e.height/2;t.moveTo(r,n-a),t.lineTo(r+i,n),t.lineTo(r,n+a),t.lineTo(r-i,n),t.closePath()}}),h=a.extendShape({type:"pin",shape:{x:0,y:0,width:0,height:0},buildPath:function(t,e){var r=e.x,n=e.y,i=e.width/5*3,a=Math.max(i,e.height),o=i/2,s=o*o/(a-o),l=n-a+o+s,h=Math.asin(s/o),u=Math.cos(h)*o,c=Math.sin(h),f=Math.cos(h),d=.6*o,p=.7*o;t.moveTo(r-u,l+s),t.arc(r,l,o,Math.PI-h,2*Math.PI+h),t.bezierCurveTo(r+u-c*d,l+s+f*d,r,n-p,r,n),t.bezierCurveTo(r,n-p,r-u+c*d,l+s+f*d,r-u,l+s),t.closePath()}}),u=a.extendShape({type:"arrow",shape:{x:0,y:0,width:0,height:0},buildPath:function(t,e){var r=e.height,n=e.width,i=e.x,a=e.y,o=n/3*2;t.moveTo(i,a),t.lineTo(i+o,a+r),t.lineTo(i,a+r/4*3),t.lineTo(i-o,a+r),t.lineTo(i,a),t.closePath()}}),c={line:a.Line,rect:a.Rect,roundRect:a.Rect,square:a.Rect,circle:a.Circle,diamond:l,pin:h,arrow:u,triangle:s},f={line:function(t,e,r,n,i){i.x1=t,i.y1=e+n/2,i.x2=t+r,i.y2=e+n/2},rect:function(t,e,r,n,i){i.x=t,i.y=e,i.width=r,i.height=n},roundRect:function(t,e,r,n,i){i.x=t,i.y=e,i.width=r,i.height=n,i.r=Math.min(r,n)/4},square:function(t,e,r,n,i){var a=Math.min(r,n);i.x=t,i.y=e,i.width=a,i.height=a},circle:function(t,e,r,n,i){i.cx=t+r/2,i.cy=e+n/2,i.r=Math.min(r,n)/2},diamond:function(t,e,r,n,i){i.cx=t+r/2,i.cy=e+n/2,i.width=r,i.height=n},pin:function(t,e,r,n,i){i.x=t+r/2,i.y=e+n/2,i.width=r,i.height=n},arrow:function(t,e,r,n,i){i.x=t+r/2,i.y=e+n/2,i.width=r,i.height=n},triangle:function(t,e,r,n,i){i.cx=t+r/2,i.cy=e+n/2,i.width=r,i.height=n}},d={};i.each(c,function(t,e){d[e]=new t});var p=a.extendShape({type:"symbol",shape:{symbolType:"",x:0,y:0,width:0,height:0},beforeBrush:function(){var t=this.style;"pin"===this.shape.symbolType&&"inside"===t.textPosition&&(t.textPosition=["50%","40%"],t.textAlign="center",t.textVerticalAlign="middle")},buildPath:function(t,e,r){var n=e.symbolType,i=d[n];"none"!==e.symbolType&&(i||(i=d[n="rect"]),f[n](e.x,e.y,e.width,e.height,i.shape),i.buildPath(t,i.shape,r))}});e.createSymbol=function(t,e,r,i,s,l,h){var u,c=0===t.indexOf("empty");return c&&(t=t.substr(5,1).toLowerCase()+t.substr(6)),(u=0===t.indexOf("image://")?a.makeImage(t.slice(8),new o(e,r,i,s),h?"center":"cover"):0===t.indexOf("path://")?a.makePath(t.slice(7),{},new o(e,r,i,s),h?"center":"cover"):new p({shape:{symbolType:t,x:e,y:r,width:i,height:s}})).__isEmptyBrush=c,u.setColor=n,u.setColor(l),u}},function(t,e,r){function n(t,e,r,n){var o=O.createFromString(t,e);return r&&("center"===n&&(r=i(r,o.getBoundingRect())),a(o,r)),o}function i(t,e){var r,n=e.width/e.height,i=t.height*n;return i<=t.width?r=t.height:r=(i=t.width)/n,{x:t.x+t.width/2-i/2,y:t.y+t.height/2-r/2,width:i,height:r}}function a(t,e){if(t.applyTransform){var r=t.getBoundingRect().calculateTransform(e);t.applyTransform(r)}}function o(t,e,r){var n=$(2*t);return(n+$(e))%2==0?n/2:(n+(r?1:-1))/2}function s(t){return null!=t&&"none"!==t}function l(t){var e=t.__hoverStl;if(e&&!t.__highlighted){var r=t.useHoverLayer;t.__highlighted=r?"layer":"plain";var n=t.__zr;if(n||!r){var i=t,a=t.style;r&&(a=(i=n.addHover(t)).style),S(a),r||function(t){if(t.__hoverStlDirty){t.__hoverStlDirty=!1;var e=t.__hoverStl;if(!e)return void(t.__cachedNormalStl=t.__cachedNormalZ2=null);var r=t.__cachedNormalStl={};t.__cachedNormalZ2=t.z2;var n=t.style;for(var i in e)null!=e[i]&&(r[i]=n[i]);r.fill=n.fill,r.stroke=n.stroke}}(i),a.extendFrom(e),h(a,e,"fill"),h(a,e,"stroke"),w(a),r||(t.dirty(!1),t.z2+=et)}}}function h(t,e,r){!s(e[r])&&s(t[r])&&(t[r]=function(t){if("string"!=typeof t)return t;var e=nt.get(t);return e||(e=C.lift(t,-.1),it<1e4&&(nt.set(t,e),it++)),e}(t[r]))}function u(t){var e=t.__highlighted;if(e)if(t.__highlighted=!1,"layer"===e)t.__zr&&t.__zr.removeHover(t);else if(e){var r=t.style,n=t.__cachedNormalStl;n&&(S(r),t.setStyle(n),w(r));var i=t.__cachedNormalZ2;null!=i&&t.z2-i===et&&(t.z2=i)}}function c(t,e){t.isGroup?t.traverse(function(t){!t.isGroup&&e(t)}):e(t)}function f(t,e){e=t.__hoverStl=!1!==e&&(e||{}),t.__hoverStlDirty=!0,t.__highlighted&&(t.__cachedNormalStl=null,u(t),l(t))}function d(t){this.__hoverSilentOnTouch&&t.zrByTouch||!this.__isEmphasisEntered&&c(this,l)}function p(t){this.__hoverSilentOnTouch&&t.zrByTouch||!this.__isEmphasisEntered&&c(this,u)}function v(){this.__isEmphasisEntered=!0,c(this,l)}function g(){this.__isEmphasisEntered=!1,c(this,u)}function y(t,e){var r=!1===e;if(t.__hoverSilentOnTouch=null!=e&&e.hoverSilentOnTouch,!r||t.__hoverStyleTrigger){var n=r?"off":"on";t[n]("mouseover",d)[n]("mouseout",p),t[n]("emphasis",v)[n]("normal",g),t.__hoverStyleTrigger=!r}}function m(t,e,r,n,i){return x(t,e,n,i),r&&k.extend(t,r),t}function x(t,e,r,n){if((r=r||tt).isRectText){var i=e.getShallow("position")||(n?null:"inside");"outside"===i&&(i="top"),t.textPosition=i,t.textOffset=e.getShallow("offset");var a=e.getShallow("rotate");null!=a&&(a*=Math.PI/180),t.textRotation=a,t.textDistance=k.retrieve2(e.getShallow("distance"),n?null:5)}var o,s=e.ecModel,l=s&&s.option.textStyle,h=function(t){for(var e;t&&t!==t.ecModel;){var r=(t.option||tt).rich;if(r)for(var n in e=e||{},r)r.hasOwnProperty(n)&&(e[n]=1);t=t.parentModel}return e}(e);if(h)for(var u in o={},h)if(h.hasOwnProperty(u)){var c=e.getModel(["rich",u]);_(o[u]={},c,l,r,n)}return t.rich=o,_(t,e,l,r,n,!0),r.forceRich&&!r.textStyle&&(r.textStyle={}),t}function _(t,e,r,n,i,a){r=!i&&r||tt,t.textFill=b(e.getShallow("color"),n)||r.color,t.textStroke=b(e.getShallow("textBorderColor"),n)||r.textBorderColor,t.textStrokeWidth=k.retrieve2(e.getShallow("textBorderWidth"),r.textBorderWidth),t.insideRawTextPosition=t.textPosition,i||(a&&(t.insideRollbackOpt=n,w(t)),null==t.textFill&&(t.textFill=n.autoColor)),t.fontStyle=e.getShallow("fontStyle")||r.fontStyle,t.fontWeight=e.getShallow("fontWeight")||r.fontWeight,t.fontSize=e.getShallow("fontSize")||r.fontSize,t.fontFamily=e.getShallow("fontFamily")||r.fontFamily,t.textAlign=e.getShallow("align"),t.textVerticalAlign=e.getShallow("verticalAlign")||e.getShallow("baseline"),t.textLineHeight=e.getShallow("lineHeight"),t.textWidth=e.getShallow("width"),t.textHeight=e.getShallow("height"),t.textTag=e.getShallow("tag"),a&&n.disableBox||(t.textBackgroundColor=b(e.getShallow("backgroundColor"),n),t.textPadding=e.getShallow("padding"),t.textBorderColor=b(e.getShallow("borderColor"),n),t.textBorderWidth=e.getShallow("borderWidth"),t.textBorderRadius=e.getShallow("borderRadius"),t.textBoxShadowColor=e.getShallow("shadowColor"),t.textBoxShadowBlur=e.getShallow("shadowBlur"),t.textBoxShadowOffsetX=e.getShallow("shadowOffsetX"),t.textBoxShadowOffsetY=e.getShallow("shadowOffsetY")),t.textShadowColor=e.getShallow("textShadowColor")||r.textShadowColor,t.textShadowBlur=e.getShallow("textShadowBlur")||r.textShadowBlur,t.textShadowOffsetX=e.getShallow("textShadowOffsetX")||r.textShadowOffsetX,t.textShadowOffsetY=e.getShallow("textShadowOffsetY")||r.textShadowOffsetY}function b(t,e){return"auto"!==t?t:e&&e.autoColor?e.autoColor:null}function w(t){var e=t.insideRollbackOpt;if(e&&null==t.textFill){var r,n=e.useInsideStyle,i=t.insideRawTextPosition,a=e.autoColor;!1!==n&&(!0===n||e.isRectText&&i&&"string"==typeof i&&i.indexOf("inside")>=0)?(r={textFill:null,textStroke:t.textStroke,textStrokeWidth:t.textStrokeWidth},t.textFill="#fff",null==t.textStroke&&(t.textStroke=a,null==t.textStrokeWidth&&(t.textStrokeWidth=2))):null!=a&&(r={textFill:null},t.textFill=a),r&&(t.insideRollback=r)}}function S(t){var e=t.insideRollback;e&&(t.textFill=e.textFill,t.textStroke=e.textStroke,t.textStrokeWidth=e.textStrokeWidth,t.insideRollback=null)}function T(t,e,r,n,i,a){if("function"==typeof i&&(a=i,i=null),n&&n.isAnimationEnabled()){var o=t?"Update":"",s=n.getShallow("animationDuration"+o),l=n.getShallow("animationEasing"+o),h=n.getShallow("animationDelay"+o);"function"==typeof h&&(h=h(i,n.getAnimationDelayParams?n.getAnimationDelayParams(e,i):null)),"function"==typeof s&&(s=s(i)),s>0?e.animateTo(r,s,h||0,l,a,!!a):(e.stopAnimation(),e.attr(r),a&&a())}else e.stopAnimation(),e.attr(r),a&&a()}function M(t,e,r,n,i){T(!0,t,e,r,n,i)}function P(t,e,r){return e&&!k.isArrayLike(e)&&(e=R.getLocalTransform(e)),r&&(e=A.invert([],e)),I.applyTransform([],t,e)}var k=r(0),O=r(41),C=r(19),A=r(10),I=r(2),D=r(1),R=r(18),L=r(60);e.Image=L;var B=r(61);e.Group=B;var E=r(62);e.Text=E;var F=r(63);e.Circle=F;var z=r(64);e.Sector=z;var N=r(66);e.Ring=N;var W=r(67);e.Polygon=W;var q=r(70);e.Polyline=q;var j=r(71);e.Rect=j;var H=r(72);e.Line=H;var Y=r(73);e.BezierCurve=Y;var U=r(74);e.Arc=U;var V=r(75);e.CompoundPath=V;var G=r(76);e.LinearGradient=G;var X=r(77);e.RadialGradient=X;var Z=r(3);e.BoundingRect=Z;var Q=r(78);e.IncrementalDisplayable=Q;var $=Math.round,K=Math.max,J=Math.min,tt={},et=1,rt=O.mergePath,nt=k.createHashMap(),it=0;e.Z2_EMPHASIS_LIFT=et,e.extendShape=function(t){return D.extend(t)},e.extendPath=function(t,e){return O.extendFromString(t,e)},e.makePath=n,e.makeImage=function(t,e,r){var n=new L({style:{image:t,x:e.x,y:e.y,width:e.width,height:e.height},onload:function(t){if("center"===r){var a={width:t.width,height:t.height};n.setStyle(i(e,a))}}});return n},e.mergePath=rt,e.resizePath=a,e.subPixelOptimizeLine=function(t){var e=t.shape,r=t.style.lineWidth;return $(2*e.x1)===$(2*e.x2)&&(e.x1=e.x2=o(e.x1,r,!0)),$(2*e.y1)===$(2*e.y2)&&(e.y1=e.y2=o(e.y1,r,!0)),t},e.subPixelOptimizeRect=function(t){var e=t.shape,r=t.style.lineWidth,n=e.x,i=e.y,a=e.width,s=e.height;return e.x=o(e.x,r,!0),e.y=o(e.y,r,!0),e.width=Math.max(o(n+a,r,!1)-e.x,0===a?0:1),e.height=Math.max(o(i+s,r,!1)-e.y,0===s?0:1),t},e.subPixelOptimize=o,e.setElementHoverStyle=f,e.isInEmphasis=function(t){return t&&t.__isEmphasisEntered},e.setHoverStyle=function(t,e,r){t.isGroup?t.traverse(function(t){!t.isGroup&&f(t,t.hoverStyle||e)}):f(t,t.hoverStyle||e),y(t,r)},e.setAsHoverStyleTrigger=y,e.setLabelStyle=function(t,e,r,n,i,a,o){var s,l=(i=i||tt).labelFetcher,h=i.labelDataIndex,u=i.labelDimIndex,c=r.getShallow("show"),f=n.getShallow("show");(c||f)&&(l&&(s=l.getFormattedLabel(h,"normal",null,u)),null==s&&(s=k.isFunction(i.defaultText)?i.defaultText(h,i):i.defaultText));var d=c?s:null,p=f?k.retrieve2(l?l.getFormattedLabel(h,"emphasis",null,u):null,s):null;null==d&&null==p||(m(t,r,a,i),m(e,n,o,i,!0)),t.text=d,e.text=p},e.setTextStyle=m,e.setText=function(t,e,r){var n,i={isRectText:!0};!1===r?n=!0:i.autoColor=r,x(t,e,i,n)},e.getFont=function(t,e){var r=e||e.getModel("textStyle");return k.trim([t.fontStyle||r&&r.getShallow("fontStyle")||"",t.fontWeight||r&&r.getShallow("fontWeight")||"",(t.fontSize||r&&r.getShallow("fontSize")||12)+"px",t.fontFamily||r&&r.getShallow("fontFamily")||"sans-serif"].join(" "))},e.updateProps=M,e.initProps=function(t,e,r,n,i){T(!1,t,e,r,n,i)},e.getTransform=function(t,e){for(var r=A.identity([]);t&&t!==e;)A.mul(r,t.getLocalTransform(),r),t=t.parent;return r},e.applyTransform=P,e.transformDirection=function(t,e,r){var n=0===e[4]||0===e[5]||0===e[0]?1:Math.abs(2*e[4]/e[0]),i=0===e[4]||0===e[5]||0===e[2]?1:Math.abs(2*e[4]/e[2]),a=["left"===t?-n:"right"===t?n:0,"top"===t?-i:"bottom"===t?i:0];return a=P(a,e,r),Math.abs(a[0])>Math.abs(a[1])?a[0]>0?"right":"left":a[1]>0?"bottom":"top"},e.groupTransition=function(t,e,r,n){function i(t){var e={position:I.clone(t.position),rotation:t.rotation};return t.shape&&(e.shape=k.extend({},t.shape)),e}if(t&&e){var a=function(t){var e={};return t.traverse(function(t){!t.isGroup&&t.anid&&(e[t.anid]=t)}),e}(t);e.traverse(function(t){if(!t.isGroup&&t.anid){var e=a[t.anid];if(e){var n=i(t);t.attr(i(e)),M(t,n,r,t.dataIndex)}}})}},e.clipPointsByRect=function(t,e){return k.map(t,function(t){var r=t[0];r=K(r,e.x),r=J(r,e.x+e.width);var n=t[1];return n=K(n,e.y),[r,n=J(n,e.y+e.height)]})},e.clipRectByRect=function(t,e){var r=K(t.x,e.x),n=J(t.x+t.width,e.x+e.width),i=K(t.y,e.y),a=J(t.y+t.height,e.y+e.height);if(n>=r&&a>=i)return{x:r,y:i,width:n-r,height:a-i}},e.createIcon=function(t,e,r){var i=(e=k.extend({rectHover:!0},e)).style={strokeNoScale:!0};if(r=r||{x:-1,y:-1,width:2,height:2},t)return 0===t.indexOf("image://")?(i.image=t.slice(8),k.defaults(i,r),new L(e)):n(t.replace("path://",""),e,r,"center")}},function(t,e,r){function n(t,e,r,n,i,a,o,s,f,v,g){var y=f*(c/180),m=u(y)*(t-r)/2+h(y)*(e-n)/2,x=-1*h(y)*(t-r)/2+u(y)*(e-n)/2,_=m*m/(o*o)+x*x/(s*s);_>1&&(o*=l(_),s*=l(_));var b=(i===a?-1:1)*l((o*o*(s*s)-o*o*(x*x)-s*s*(m*m))/(o*o*(x*x)+s*s*(m*m)))||0,w=b*o*x/s,S=b*-s*m/o,T=(t+r)/2+u(y)*w-h(y)*S,M=(e+n)/2+h(y)*w+u(y)*S,P=p([1,0],[(m-w)/o,(x-S)/s]),k=[(m-w)/o,(x-S)/s],O=[(-1*m-w)/o,(-1*x-S)/s],C=p(k,O);d(k,O)<=-1&&(C=c),d(k,O)>=1&&(C=0),0===a&&C>0&&(C-=2*c),1===a&&C<0&&(C+=2*c),g.addData(v,T,M,o,s,P,C,y,a)}function i(t,e){var r=function(t){if(!t)return new o;for(var e,r=0,i=0,a=r,s=i,l=new o,h=o.CMD,u=t.match(v),c=0;c<u.length;c++){for(var f,d=u[c],p=d.charAt(0),y=d.match(g)||[],m=y.length,x=0;x<m;x++)y[x]=parseFloat(y[x]);for(var _=0;_<m;){var b,w,S,T,M,P,k,O=r,C=i;switch(p){case"l":r+=y[_++],i+=y[_++],f=h.L,l.addData(f,r,i);break;case"L":r=y[_++],i=y[_++],f=h.L,l.addData(f,r,i);break;case"m":r+=y[_++],i+=y[_++],f=h.M,l.addData(f,r,i),a=r,s=i,p="l";break;case"M":r=y[_++],i=y[_++],f=h.M,l.addData(f,r,i),a=r,s=i,p="L";break;case"h":r+=y[_++],f=h.L,l.addData(f,r,i);break;case"H":r=y[_++],f=h.L,l.addData(f,r,i);break;case"v":i+=y[_++],f=h.L,l.addData(f,r,i);break;case"V":i=y[_++],f=h.L,l.addData(f,r,i);break;case"C":f=h.C,l.addData(f,y[_++],y[_++],y[_++],y[_++],y[_++],y[_++]),r=y[_-2],i=y[_-1];break;case"c":f=h.C,l.addData(f,y[_++]+r,y[_++]+i,y[_++]+r,y[_++]+i,y[_++]+r,y[_++]+i),r+=y[_-2],i+=y[_-1];break;case"S":b=r,w=i;var A=l.len(),I=l.data;e===h.C&&(b+=r-I[A-4],w+=i-I[A-3]),f=h.C,O=y[_++],C=y[_++],r=y[_++],i=y[_++],l.addData(f,b,w,O,C,r,i);break;case"s":b=r,w=i,A=l.len(),I=l.data,e===h.C&&(b+=r-I[A-4],w+=i-I[A-3]),f=h.C,O=r+y[_++],C=i+y[_++],r+=y[_++],i+=y[_++],l.addData(f,b,w,O,C,r,i);break;case"Q":O=y[_++],C=y[_++],r=y[_++],i=y[_++],f=h.Q,l.addData(f,O,C,r,i);break;case"q":O=y[_++]+r,C=y[_++]+i,r+=y[_++],i+=y[_++],f=h.Q,l.addData(f,O,C,r,i);break;case"T":b=r,w=i,A=l.len(),I=l.data,e===h.Q&&(b+=r-I[A-4],w+=i-I[A-3]),r=y[_++],i=y[_++],f=h.Q,l.addData(f,b,w,r,i);break;case"t":b=r,w=i,A=l.len(),I=l.data,e===h.Q&&(b+=r-I[A-4],w+=i-I[A-3]),r+=y[_++],i+=y[_++],f=h.Q,l.addData(f,b,w,r,i);break;case"A":S=y[_++],T=y[_++],M=y[_++],P=y[_++],k=y[_++],n(O=r,C=i,r=y[_++],i=y[_++],P,k,S,T,M,f=h.A,l);break;case"a":S=y[_++],T=y[_++],M=y[_++],P=y[_++],k=y[_++],n(O=r,C=i,r+=y[_++],i+=y[_++],P,k,S,T,M,f=h.A,l)}}"z"!==p&&"Z"!==p||(f=h.Z,l.addData(f),r=a,i=s),e=f}return l.toStatic(),l}(t);return(e=e||{}).buildPath=function(t){if(t.setData){t.setData(r.data),(e=t.getContext())&&t.rebuildPath(e)}else{var e=t;r.rebuildPath(e)}},e.applyTransform=function(t){s(r,t),this.dirty(!0)},e}var a=r(1),o=r(9),s=r(59),l=Math.sqrt,h=Math.sin,u=Math.cos,c=Math.PI,f=function(t){return Math.sqrt(t[0]*t[0]+t[1]*t[1])},d=function(t,e){return(t[0]*e[0]+t[1]*e[1])/(f(t)*f(e))},p=function(t,e){return(t[0]*e[1]<t[1]*e[0]?-1:1)*Math.acos(d(t,e))},v=/([mlvhzcqtsa])([^mlvhzcqtsa]*)/gi,g=/-?([0-9]*\.)?[0-9]+([eE]-?[0-9]+)?/g;e.createFromString=function(t,e){return new a(i(t,e))},e.extendFromString=function(t,e){return a.extend(i(t,e))},e.mergePath=function(t,e){for(var r=[],n=t.length,i=0;i<n;i++){var o=t[i];o.path||o.createPathProxy(),o.__dirtyPath&&o.buildPath(o.path,o.shape,!0),r.push(o.path)}var s=new a(e);return s.createPathProxy(),s.buildPath=function(t){t.appendPath(r);var e=t.getContext();e&&t.rebuildPath(e)},s}},function(t,e,r){function n(t,e,r){var n=null==e.x?0:e.x,i=null==e.x2?1:e.x2,a=null==e.y?0:e.y,o=null==e.y2?0:e.y2;return e.global||(n=n*r.width+r.x,i=i*r.width+r.x,a=a*r.height+r.y,o=o*r.height+r.y),n=isNaN(n)?0:n,i=isNaN(i)?1:i,a=isNaN(a)?0:a,o=isNaN(o)?0:o,t.createLinearGradient(n,a,i,o)}function i(t,e,r){var n=r.width,i=r.height,a=Math.min(n,i),o=null==e.x?.5:e.x,s=null==e.y?.5:e.y,l=null==e.r?.5:e.r;return e.global||(o=o*n+r.x,s=s*i+r.y,l*=a),t.createRadialGradient(o,s,0,o,s,l)}for(var a=r(16),o=r(8).ContextCachedBy,s=[["shadowBlur",0],["shadowOffsetX",0],["shadowOffsetY",0],["shadowColor","#000"],["lineCap","butt"],["lineJoin","miter"],["miterLimit",10]],l=function(t){this.extendFrom(t,!1)},h=l.prototype={constructor:l,fill:"#000",stroke:null,opacity:1,fillOpacity:null,strokeOpacity:null,lineDash:null,lineDashOffset:0,shadowBlur:0,shadowOffsetX:0,shadowOffsetY:0,lineWidth:1,strokeNoScale:!1,text:null,font:null,textFont:null,fontStyle:null,fontWeight:null,fontSize:null,fontFamily:null,textTag:null,textFill:"#000",textStroke:null,textWidth:null,textHeight:null,textStrokeWidth:0,textLineHeight:null,textPosition:"inside",textRect:null,textOffset:null,textAlign:null,textVerticalAlign:null,textDistance:5,textShadowColor:"transparent",textShadowBlur:0,textShadowOffsetX:0,textShadowOffsetY:0,textBoxShadowColor:"transparent",textBoxShadowBlur:0,textBoxShadowOffsetX:0,textBoxShadowOffsetY:0,transformText:!1,textRotation:0,textOrigin:null,textBackgroundColor:null,textBorderColor:null,textBorderWidth:0,textBorderRadius:0,textPadding:null,rich:null,truncate:null,blend:null,bind:function(t,e,r){var n=this,i=r&&r.style,l=!i||t.__attrCachedBy!==o.STYLE_BIND;t.__attrCachedBy=o.STYLE_BIND;for(var h=0;h<s.length;h++){var u=s[h],c=u[0];(l||n[c]!==i[c])&&(t[c]=a(t,c,n[c]||u[1]))}if((l||n.fill!==i.fill)&&(t.fillStyle=n.fill),(l||n.stroke!==i.stroke)&&(t.strokeStyle=n.stroke),(l||n.opacity!==i.opacity)&&(t.globalAlpha=null==n.opacity?1:n.opacity),(l||n.blend!==i.blend)&&(t.globalCompositeOperation=n.blend||"source-over"),this.hasStroke()){var f=n.lineWidth;t.lineWidth=f/(this.strokeNoScale&&e&&e.getLineScale?e.getLineScale():1)}},hasFill:function(){var t=this.fill;return null!=t&&"none"!==t},hasStroke:function(){var t=this.stroke;return null!=t&&"none"!==t&&this.lineWidth>0},extendFrom:function(t,e){if(t)for(var r in t)!t.hasOwnProperty(r)||!0!==e&&(!1===e?this.hasOwnProperty(r):null==t[r])||(this[r]=t[r])},set:function(t,e){"string"==typeof t?this[t]=e:this.extendFrom(t,!0)},clone:function(){var t=new this.constructor;return t.extendFrom(this,!0),t},getGradient:function(t,e,r){for(var a=("radial"===e.type?i:n)(t,e,r),o=e.colorStops,s=0;s<o.length;s++)a.addColorStop(o[s].offset,o[s].color);return a}},u=0;u<s.length;u++){var c=s[u];c[0]in h||(h[c[0]]=c[1])}l.getGradient=h.getGradient;var f=l;t.exports=f},function(t,e){var r=2311;t.exports=function(){return r++}},function(t,e){function r(t,e,r,n,i,a){var o=t._$handlers;if("function"==typeof r&&(i=n,n=r,r=null),!n||!e)return t;r=function(t,e){var r=t._$eventProcessor;return null!=e&&r&&r.normalizeQuery&&(e=r.normalizeQuery(e)),e}(t,r),o[e]||(o[e]=[]);for(var s=0;s<o[e].length;s++)if(o[e][s].h===n)return t;var l={h:n,one:a,query:r,ctx:i||t,callAtLast:n.zrEventfulCallAtLast},h=o[e].length-1,u=o[e][h];return u&&u.callAtLast?o[e].splice(h,0,l):o[e].push(l),t}var n=Array.prototype.slice,i=function(t){this._$handlers={},this._$eventProcessor=t};i.prototype={constructor:i,one:function(t,e,n,i){return r(this,t,e,n,i,!0)},on:function(t,e,n,i){return r(this,t,e,n,i,!1)},isSilent:function(t){var e=this._$handlers;return!e[t]||!e[t].length},off:function(t,e){var r=this._$handlers;if(!t)return this._$handlers={},this;if(e){if(r[t]){for(var n=[],i=0,a=r[t].length;i<a;i++)r[t][i].h!==e&&n.push(r[t][i]);r[t]=n}r[t]&&0===r[t].length&&delete r[t]}else delete r[t];return this},trigger:function(t){var e=this._$handlers[t],r=this._$eventProcessor;if(e){var i=arguments,a=i.length;a>3&&(i=n.call(i,1));for(var o=e.length,s=0;s<o;){var l=e[s];if(r&&r.filter&&null!=l.query&&!r.filter(t,l.query))s++;else{switch(a){case 1:l.h.call(l.ctx);break;case 2:l.h.call(l.ctx,i[1]);break;case 3:l.h.call(l.ctx,i[1],i[2]);break;default:l.h.apply(l.ctx,i)}l.one?(e.splice(s,1),o--):s++}}}return r&&r.afterTrigger&&r.afterTrigger(t),this},triggerWithContext:function(t){var e=this._$handlers[t],r=this._$eventProcessor;if(e){var i=arguments,a=i.length;a>4&&(i=n.call(i,1,i.length-1));for(var o=i[i.length-1],s=e.length,l=0;l<s;){var h=e[l];if(r&&r.filter&&null!=h.query&&!r.filter(t,h.query))l++;else{switch(a){case 1:h.h.call(o);break;case 2:h.h.call(o,i[1]);break;case 3:h.h.call(o,i[1],i[2]);break;default:h.h.apply(o,i)}h.one?(e.splice(l,1),s--):l++}}}return r&&r.afterTrigger&&r.afterTrigger(t),this}};var a=i;t.exports=a},function(t,e,r){function n(t,e,r,n,a,o,s,l){function c(){--d||o&&o()}h(n)?(o=a,a=n,n=0):u(a)?(o=a,a="linear",n=0):u(n)?(o=n,n=0):u(r)?(o=r,r=500):r||(r=500),t.stopAnimation(),i(t,"",t,e,r,n,l);var f=t.animators.slice(),d=f.length;d||o&&o();for(var p=0;p<f.length;p++)f[p].done(c).start(a,s)}function i(t,e,r,n,o,s,l){var h={},u=0;for(var d in n)n.hasOwnProperty(d)&&(null!=r[d]?c(n[d])&&!f(n[d])?i(t,e?e+"."+d:d,r[d],n[d],o,s,l):(l?(h[d]=r[d],a(t,e,d,n[d])):h[d]=n[d],u++):null==n[d]||l||a(t,e,d,n[d]));u>0&&t.animate(e,!1).when(null==o?500:o,h).delay(s||0)}function a(t,e,r,n){if(e){var i={};i[e]={},i[e][r]=n,t.attr(i)}else t.attr(r,n)}var o=r(46),s=r(49),l=r(0),h=l.isString,u=l.isFunction,c=l.isObject,f=l.isArrayLike,d=l.indexOf,p=function(){this.animators=[]};p.prototype={constructor:p,animate:function(t,e){var r,n=!1,i=this,a=this.__zr;if(t){var l=t.split("."),h=i;n="shape"===l[0];for(var u=0,c=l.length;u<c;u++)h&&(h=h[l[u]]);h&&(r=h)}else r=i;if(r){var f=i.animators,p=new o(r,e);return p.during(function(t){i.dirty(n)}).done(function(){f.splice(d(f,p),1)}),f.push(p),a&&a.animation.addAnimator(p),p}s('Property "'+t+'" is not existed in element '+i.id)},stopAnimation:function(t){for(var e=this.animators,r=e.length,n=0;n<r;n++)e[n].stop(t);return e.length=0,this},animateTo:function(t,e,r,i,a,o){n(this,t,e,r,i,a,o)},animateFrom:function(t,e,r,i,a,o){n(this,t,e,r,i,a,o,!0)}};var v=p;t.exports=v},function(t,e,r){function n(t,e){return t[e]}function i(t,e,r){t[e]=r}function a(t,e,r){return(e-t)*r+t}function o(t,e,r){return r>.5?e:t}function s(t,e,r,n,i){var o=t.length;if(1===i)for(var s=0;s<o;s++)n[s]=a(t[s],e[s],r);else{var l=o&&t[0].length;for(s=0;s<o;s++)for(var h=0;h<l;h++)n[s][h]=a(t[s][h],e[s][h],r)}}function l(t,e,r){var n=t.length,i=e.length;if(n!==i)if(n>i)t.length=i;else for(var a=n;a<i;a++)t.push(1===r?e[a]:m.call(e[a]));var o=t[0]&&t[0].length;for(a=0;a<t.length;a++)if(1===r)isNaN(t[a])&&(t[a]=e[a]);else for(var s=0;s<o;s++)isNaN(t[a][s])&&(t[a][s]=e[a][s])}function h(t,e,r){if(t===e)return!0;var n=t.length;if(n!==e.length)return!1;if(1===r){for(var i=0;i<n;i++)if(t[i]!==e[i])return!1}else{var a=t[0].length;for(i=0;i<n;i++)for(var o=0;o<a;o++)if(t[i][o]!==e[i][o])return!1}return!0}function u(t,e,r,n,i,a,o,s,l){var h=t.length;if(1===l)for(var u=0;u<h;u++)s[u]=c(t[u],e[u],r[u],n[u],i,a,o);else{var f=t[0].length;for(u=0;u<h;u++)for(var d=0;d<f;d++)s[u][d]=c(t[u][d],e[u][d],r[u][d],n[u][d],i,a,o)}}function c(t,e,r,n,i,a,o){var s=.5*(r-t),l=.5*(n-e);return(2*(e-r)+s+l)*o+(-3*(e-r)-2*s-l)*a+s*i+e}function f(t){if(y(t)){var e=t.length;if(y(t[0])){for(var r=[],n=0;n<e;n++)r.push(m.call(t[n]));return r}return m.call(t)}return t}function d(t){return t[0]=Math.floor(t[0]),t[1]=Math.floor(t[1]),t[2]=Math.floor(t[2]),"rgba("+t.join(",")+")"}function p(t,e,r,n,i,f){var p=t._getter,m=t._setter,x="spline"===e,_=n.length;if(_){var b,w=n[0].value,S=y(w),T=!1,M=!1,P=S?function(t){var e=t[t.length-1].value;return y(e&&e[0])?2:1}(n):0;n.sort(function(t,e){return t.time-e.time}),b=n[_-1].time;for(var k=[],O=[],C=n[0].value,A=!0,I=0;I<_;I++){k.push(n[I].time/b);var D=n[I].value;if(S&&h(D,C,P)||!S&&D===C||(A=!1),C=D,"string"==typeof D){var R=g.parse(D);R?(D=R,T=!0):M=!0}O.push(D)}if(f||!A){var L=O[_-1];for(I=0;I<_-1;I++)S?l(O[I],L,P):!isNaN(O[I])||isNaN(L)||M||T||(O[I]=L);S&&l(p(t._target,i),L,P);var B,E,F,z,N,W=0,q=0;if(T)var j=[0,0,0,0];var H=new v({target:t._target,life:b,loop:t._loop,delay:t._delay,onframe:function(t,e){var r;if(e<0)r=0;else if(e<q){for(r=Math.min(W+1,_-1);r>=0&&!(k[r]<=e);r--);r=Math.min(r,_-2)}else{for(r=W;r<_&&!(k[r]>e);r++);r=Math.min(r-1,_-2)}W=r,q=e;var n=k[r+1]-k[r];if(0!==n)if(B=(e-k[r])/n,x)if(F=O[r],E=O[0===r?r:r-1],z=O[r>_-2?_-1:r+1],N=O[r>_-3?_-1:r+2],S)u(E,F,z,N,B,B*B,B*B*B,p(t,i),P);else{if(T)l=u(E,F,z,N,B,B*B,B*B*B,j,1),l=d(j);else{if(M)return o(F,z,B);l=c(E,F,z,N,B,B*B,B*B*B)}m(t,i,l)}else if(S)s(O[r],O[r+1],B,p(t,i),P);else{var l;if(T)s(O[r],O[r+1],B,j,1),l=d(j);else{if(M)return o(O[r],O[r+1],B);l=a(O[r],O[r+1],B)}m(t,i,l)}},ondestroy:r});return e&&"spline"!==e&&(H.easing=e),H}}}var v=r(47),g=r(19),y=r(0).isArrayLike,m=Array.prototype.slice,x=function(t,e,r,a){this._tracks={},this._target=t,this._loop=e||!1,this._getter=r||n,this._setter=a||i,this._clipCount=0,this._delay=0,this._doneList=[],this._onframeList=[],this._clipList=[]};x.prototype={when:function(t,e){var r=this._tracks;for(var n in e)if(e.hasOwnProperty(n)){if(!r[n]){r[n]=[];var i=this._getter(this._target,n);if(null==i)continue;0!==t&&r[n].push({time:0,value:f(i)})}r[n].push({time:t,value:e[n]})}return this},during:function(t){return this._onframeList.push(t),this},pause:function(){for(var t=0;t<this._clipList.length;t++)this._clipList[t].pause();this._paused=!0},resume:function(){for(var t=0;t<this._clipList.length;t++)this._clipList[t].resume();this._paused=!1},isPaused:function(){return!!this._paused},_doneCallback:function(){this._tracks={},this._clipList.length=0;for(var t=this._doneList,e=t.length,r=0;r<e;r++)t[r].call(this)},start:function(t,e){var r,n=this,i=0,a=function(){--i||n._doneCallback()};for(var o in this._tracks)if(this._tracks.hasOwnProperty(o)){var s=p(this,t,a,this._tracks[o],o,e);s&&(this._clipList.push(s),i++,this.animation&&this.animation.addClip(s),r=s)}if(r){var l=r.onframe;r.onframe=function(t,e){l(t,e);for(var r=0;r<n._onframeList.length;r++)n._onframeList[r](t,e)}}return i||this._doneCallback(),this},stop:function(t){for(var e=this._clipList,r=this.animation,n=0;n<e.length;n++){var i=e[n];t&&i.onframe(this._target,1),r&&r.removeClip(i)}e.length=0},delay:function(t){return this._delay=t,this},done:function(t){return t&&this._doneList.push(t),this},getClips:function(){return this._clipList}};var _=x;t.exports=_},function(t,e,r){function n(t){this._target=t.target,this._life=t.life||1e3,this._delay=t.delay||0,this._initialized=!1,this.loop=null!=t.loop&&t.loop,this.gap=t.gap||0,this.easing=t.easing||"Linear",this.onframe=t.onframe,this.ondestroy=t.ondestroy,this.onrestart=t.onrestart,this._pausedTime=0,this._paused=!1}var i=r(48);n.prototype={constructor:n,step:function(t,e){if(this._initialized||(this._startTime=t+this._delay,this._initialized=!0),this._paused)this._pausedTime+=e;else{var r=(t-this._startTime-this._pausedTime)/this._life;if(!(r<0)){r=Math.min(r,1);var n=this.easing,a="string"==typeof n?i[n]:n,o="function"==typeof a?a(r):r;return this.fire("frame",o),1===r?this.loop?(this.restart(t),"restart"):(this._needsRemove=!0,"destroy"):null}}},restart:function(t){var e=(t-this._startTime-this._pausedTime)%this._life;this._startTime=t-e+this.gap,this._pausedTime=0,this._needsRemove=!1},fire:function(t,e){this[t="on"+t]&&this[t](this._target,e)},pause:function(){this._paused=!0},resume:function(){this._paused=!1}};var a=n;t.exports=a},function(t,e){var r={linear:function(t){return t},quadraticIn:function(t){return t*t},quadraticOut:function(t){return t*(2-t)},quadraticInOut:function(t){return(t*=2)<1?.5*t*t:-.5*(--t*(t-2)-1)},cubicIn:function(t){return t*t*t},cubicOut:function(t){return--t*t*t+1},cubicInOut:function(t){return(t*=2)<1?.5*t*t*t:.5*((t-=2)*t*t+2)},quarticIn:function(t){return t*t*t*t},quarticOut:function(t){return 1- --t*t*t*t},quarticInOut:function(t){return(t*=2)<1?.5*t*t*t*t:-.5*((t-=2)*t*t*t-2)},quinticIn:function(t){return t*t*t*t*t},quinticOut:function(t){return--t*t*t*t*t+1},quinticInOut:function(t){return(t*=2)<1?.5*t*t*t*t*t:.5*((t-=2)*t*t*t*t+2)},sinusoidalIn:function(t){return 1-Math.cos(t*Math.PI/2)},sinusoidalOut:function(t){return Math.sin(t*Math.PI/2)},sinusoidalInOut:function(t){return.5*(1-Math.cos(Math.PI*t))},exponentialIn:function(t){return 0===t?0:Math.pow(1024,t-1)},exponentialOut:function(t){return 1===t?1:1-Math.pow(2,-10*t)},exponentialInOut:function(t){return 0===t?0:1===t?1:(t*=2)<1?.5*Math.pow(1024,t-1):.5*(2-Math.pow(2,-10*(t-1)))},circularIn:function(t){return 1-Math.sqrt(1-t*t)},circularOut:function(t){return Math.sqrt(1- --t*t)},circularInOut:function(t){return(t*=2)<1?-.5*(Math.sqrt(1-t*t)-1):.5*(Math.sqrt(1-(t-=2)*t)+1)},elasticIn:function(t){var e,r=.1;return 0===t?0:1===t?1:(!r||r<1?(r=1,e=.1):e=.4*Math.asin(1/r)/(2*Math.PI),-r*Math.pow(2,10*(t-=1))*Math.sin((t-e)*(2*Math.PI)/.4))},elasticOut:function(t){var e,r=.1;return 0===t?0:1===t?1:(!r||r<1?(r=1,e=.1):e=.4*Math.asin(1/r)/(2*Math.PI),r*Math.pow(2,-10*t)*Math.sin((t-e)*(2*Math.PI)/.4)+1)},elasticInOut:function(t){var e,r=.1;return 0===t?0:1===t?1:(!r||r<1?(r=1,e=.1):e=.4*Math.asin(1/r)/(2*Math.PI),(t*=2)<1?r*Math.pow(2,10*(t-=1))*Math.sin((t-e)*(2*Math.PI)/.4)*-.5:r*Math.pow(2,-10*(t-=1))*Math.sin((t-e)*(2*Math.PI)/.4)*.5+1)},backIn:function(t){var e=1.70158;return t*t*((e+1)*t-e)},backOut:function(t){var e=1.70158;return--t*t*((e+1)*t+e)+1},backInOut:function(t){var e=2.5949095;return(t*=2)<1?t*t*((e+1)*t-e)*.5:.5*((t-=2)*t*((e+1)*t+e)+2)},bounceIn:function(t){return 1-r.bounceOut(1-t)},bounceOut:function(t){return t<1/2.75?7.5625*t*t:t<2/2.75?7.5625*(t-=1.5/2.75)*t+.75:t<2.5/2.75?7.5625*(t-=2.25/2.75)*t+.9375:7.5625*(t-=2.625/2.75)*t+.984375},bounceInOut:function(t){return t<.5?.5*r.bounceIn(2*t):.5*r.bounceOut(2*t-1)+.5}},n=r;t.exports=n},function(t,e,r){var n=r(21).debugMode,i=function(){};1===n?i=function(){for(var t in arguments)throw new Error(arguments[t])}:n>1&&(i=function(){for(var t in arguments)console.log(arguments[t])});var a=i;t.exports=a},function(t,e,r){var n=r(22),i=r(3),a=r(8).WILL_BE_RESTORED,o=new i,s=function(){};s.prototype={constructor:s,drawRectText:function(t,e){var r=this.style;e=r.textRect||e,this.__dirty&&n.normalizeTextStyle(r,!0);var i=r.text;if(null!=i&&(i+=""),n.needDrawText(i,r)){t.save();var s=this.transform;r.transformText?this.setTransform(t):s&&(o.copy(e),o.applyTransform(s),e=o),n.renderText(this,t,i,r,e,a),t.restore()}}};var l=s;t.exports=l},function(t,e,r){var n=r(2),i=r(4),a=Math.min,o=Math.max,s=Math.sin,l=Math.cos,h=2*Math.PI,u=n.create(),c=n.create(),f=n.create(),d=[],p=[];e.fromPoints=function(t,e,r){if(0!==t.length){var n,i=t[0],s=i[0],l=i[0],h=i[1],u=i[1];for(n=1;n<t.length;n++)i=t[n],s=a(s,i[0]),l=o(l,i[0]),h=a(h,i[1]),u=o(u,i[1]);e[0]=s,e[1]=h,r[0]=l,r[1]=u}},e.fromLine=function(t,e,r,n,i,s){i[0]=a(t,r),i[1]=a(e,n),s[0]=o(t,r),s[1]=o(e,n)},e.fromCubic=function(t,e,r,n,s,l,h,u,c,f){var v,g=i.cubicExtrema,y=i.cubicAt,m=g(t,r,s,h,d);for(c[0]=1/0,c[1]=1/0,f[0]=-1/0,f[1]=-1/0,v=0;v<m;v++){var x=y(t,r,s,h,d[v]);c[0]=a(x,c[0]),f[0]=o(x,f[0])}for(m=g(e,n,l,u,p),v=0;v<m;v++){var _=y(e,n,l,u,p[v]);c[1]=a(_,c[1]),f[1]=o(_,f[1])}c[0]=a(t,c[0]),f[0]=o(t,f[0]),c[0]=a(h,c[0]),f[0]=o(h,f[0]),c[1]=a(e,c[1]),f[1]=o(e,f[1]),c[1]=a(u,c[1]),f[1]=o(u,f[1])},e.fromQuadratic=function(t,e,r,n,s,l,h,u){var c=i.quadraticExtremum,f=i.quadraticAt,d=o(a(c(t,r,s),1),0),p=o(a(c(e,n,l),1),0),v=f(t,r,s,d),g=f(e,n,l,p);h[0]=a(t,s,v),h[1]=a(e,l,g),u[0]=o(t,s,v),u[1]=o(e,l,g)},e.fromArc=function(t,e,r,i,a,o,d,p,v){var g=n.min,y=n.max,m=Math.abs(a-o);if(m%h<1e-4&&m>1e-4)return p[0]=t-r,p[1]=e-i,v[0]=t+r,void(v[1]=e+i);if(u[0]=l(a)*r+t,u[1]=s(a)*i+e,c[0]=l(o)*r+t,c[1]=s(o)*i+e,g(p,u,c),y(v,u,c),(a%=h)<0&&(a+=h),(o%=h)<0&&(o+=h),a>o&&!d?o+=h:a<o&&d&&(a+=h),d){var x=o;o=a,a=x}for(var _=0;_<o;_+=Math.PI/2)_>a&&(f[0]=l(_)*r+t,f[1]=s(_)*i+e,g(p,f,p),y(v,f,v))}},function(t,e,r){function n(t,e){return Math.abs(t-e)<x}function i(){var t=b[0];b[0]=b[1],b[1]=t}function a(t,e,r,n,a,o,s,l,h,u){if(u>e&&u>n&&u>o&&u>l||u<e&&u<n&&u<o&&u<l)return 0;var c=v.cubicRootAt(e,n,o,l,u,_);if(0===c)return 0;for(var f,d,p=0,g=-1,y=0;y<c;y++){var m=_[y],x=0===m||1===m?.5:1;v.cubicAt(t,r,a,s,m)<h||(g<0&&(g=v.cubicExtrema(e,n,o,l,b),b[1]<b[0]&&g>1&&i(),f=v.cubicAt(e,n,o,l,b[0]),g>1&&(d=v.cubicAt(e,n,o,l,b[1]))),p+=2===g?m<b[0]?f<e?x:-x:m<b[1]?d<f?x:-x:l<d?x:-x:m<b[0]?f<e?x:-x:l<f?x:-x)}return p}function o(t,e,r,n,i,a,o,s){if(s>e&&s>n&&s>a||s<e&&s<n&&s<a)return 0;var l=v.quadraticRootAt(e,n,a,s,_);if(0===l)return 0;var h=v.quadraticExtremum(e,n,a);if(h>=0&&h<=1){for(var u=0,c=v.quadraticAt(e,n,a,h),f=0;f<l;f++){var d=0===_[f]||1===_[f]?.5:1;v.quadraticAt(t,r,i,_[f])<o||(u+=_[f]<h?c<e?d:-d:a<c?d:-d)}return u}d=0===_[0]||1===_[0]?.5:1;return v.quadraticAt(t,r,i,_[0])<o?0:a<e?d:-d}function s(t,e,r,n,i,a,o,s){if((s-=e)>r||s<-r)return 0;var l=Math.sqrt(r*r-s*s);_[0]=-l,_[1]=l;var h=Math.abs(n-i);if(h<1e-4)return 0;if(h%m<1e-4){n=0,i=m;var u=a?1:-1;return o>=_[0]+t&&o<=_[1]+t?u:0}if(a){l=n;n=p(i),i=p(l)}else n=p(n),i=p(i);n>i&&(i+=m);for(var c=0,f=0;f<2;f++){var d=_[f];if(d+t>o){var v=Math.atan2(s,d);u=a?1:-1;v<0&&(v=m+v),(v>=n&&v<=i||v+m>=n&&v+m<=i)&&(v>Math.PI/2&&v<1.5*Math.PI&&(u=-u),c+=u)}}return c}function l(t,e,r,i,l){for(var h=0,p=0,v=0,m=0,x=0,_=0;_<t.length;){var b=t[_++];switch(b===y.M&&_>1&&(r||(h+=g(p,v,m,x,i,l))),1===_&&(m=p=t[_],x=v=t[_+1]),b){case y.M:p=m=t[_++],v=x=t[_++];break;case y.L:if(r){if(u.containStroke(p,v,t[_],t[_+1],e,i,l))return!0}else h+=g(p,v,t[_],t[_+1],i,l)||0;p=t[_++],v=t[_++];break;case y.C:if(r){if(c.containStroke(p,v,t[_++],t[_++],t[_++],t[_++],t[_],t[_+1],e,i,l))return!0}else h+=a(p,v,t[_++],t[_++],t[_++],t[_++],t[_],t[_+1],i,l)||0;p=t[_++],v=t[_++];break;case y.Q:if(r){if(f.containStroke(p,v,t[_++],t[_++],t[_],t[_+1],e,i,l))return!0}else h+=o(p,v,t[_++],t[_++],t[_],t[_+1],i,l)||0;p=t[_++],v=t[_++];break;case y.A:var w=t[_++],S=t[_++],T=t[_++],M=t[_++],P=t[_++],k=t[_++];_+=1;var O=1-t[_++],C=Math.cos(P)*T+w,A=Math.sin(P)*M+S;_>1?h+=g(p,v,C,A,i,l):(m=C,x=A);var I=(i-w)*M/T+w;if(r){if(d.containStroke(w,S,M,P,P+k,O,e,I,l))return!0}else h+=s(w,S,M,P,P+k,O,I,l);p=Math.cos(P+k)*T+w,v=Math.sin(P+k)*M+S;break;case y.R:m=p=t[_++],x=v=t[_++];C=m+t[_++],A=x+t[_++];if(r){if(u.containStroke(m,x,C,x,e,i,l)||u.containStroke(C,x,C,A,e,i,l)||u.containStroke(C,A,m,A,e,i,l)||u.containStroke(m,A,m,x,e,i,l))return!0}else h+=g(C,x,C,A,i,l),h+=g(m,A,m,x,i,l);break;case y.Z:if(r){if(u.containStroke(p,v,m,x,e,i,l))return!0}else h+=g(p,v,m,x,i,l);p=m,v=x}}return r||n(v,x)||(h+=g(p,v,m,x,i,l)||0),0!==h}var h=r(9),u=r(53),c=r(54),f=r(55),d=r(56),p=r(25).normalizeRadian,v=r(4),g=r(57),y=h.CMD,m=2*Math.PI,x=1e-4,_=[-1,-1,-1],b=[-1,-1];e.contain=function(t,e,r){return l(t,0,!1,e,r)},e.containStroke=function(t,e,r,n){return l(t,e,!0,r,n)}},function(t,e){e.containStroke=function(t,e,r,n,i,a,o){if(0===i)return!1;var s,l=i;if(o>e+l&&o>n+l||o<e-l&&o<n-l||a>t+l&&a>r+l||a<t-l&&a<r-l)return!1;if(t===r)return Math.abs(a-t)<=l/2;var h=(s=(e-n)/(t-r))*a-o+(t*n-r*e)/(t-r);return h*h/(s*s+1)<=l/2*l/2}},function(t,e,r){var n=r(4);e.containStroke=function(t,e,r,i,a,o,s,l,h,u,c){if(0===h)return!1;var f=h;return!(c>e+f&&c>i+f&&c>o+f&&c>l+f||c<e-f&&c<i-f&&c<o-f&&c<l-f||u>t+f&&u>r+f&&u>a+f&&u>s+f||u<t-f&&u<r-f&&u<a-f&&u<s-f)&&n.cubicProjectPoint(t,e,r,i,a,o,s,l,u,c,null)<=f/2}},function(t,e,r){var n=r(4).quadraticProjectPoint;e.containStroke=function(t,e,r,i,a,o,s,l,h){if(0===s)return!1;var u=s;return!(h>e+u&&h>i+u&&h>o+u||h<e-u&&h<i-u&&h<o-u||l>t+u&&l>r+u&&l>a+u||l<t-u&&l<r-u&&l<a-u)&&n(t,e,r,i,a,o,l,h,null)<=u/2}},function(t,e,r){var n=r(25).normalizeRadian,i=2*Math.PI;e.containStroke=function(t,e,r,a,o,s,l,h,u){if(0===l)return!1;var c=l;h-=t,u-=e;var f=Math.sqrt(h*h+u*u);if(f-c>r||f+c<r)return!1;if(Math.abs(a-o)%i<1e-4)return!0;if(s){var d=a;a=n(o),o=n(d)}else a=n(a),o=n(o);a>o&&(o+=i);var p=Math.atan2(u,h);return p<0&&(p+=i),p>=a&&p<=o||p+i>=a&&p+i<=o}},function(t,e){t.exports=function(t,e,r,n,i,a){if(a>e&&a>n||a<e&&a<n)return 0;if(n===e)return 0;var o=n<e?1:-1,s=(a-e)/(n-e);1!==s&&0!==s||(o=n<e?.5:-.5);var l=s*(r-t)+t;return l===i?1/0:l>i?o:0}},function(t,e){var r=function(t,e){this.image=t,this.repeat=e,this.type="pattern"};r.prototype.getCanvasPattern=function(t){return t.createPattern(this.image,this.repeat||"repeat")};var n=r;t.exports=n},function(t,e,r){var n=r(9),i=r(2).applyTransform,a=n.CMD,o=[[],[],[]],s=Math.sqrt,l=Math.atan2;t.exports=function(t,e){var r,n,h,u,c,f=t.data,d=a.M,p=a.C,v=a.L,g=a.R,y=a.A,m=a.Q;for(h=0,u=0;h<f.length;){switch(r=f[h++],u=h,n=0,r){case d:case v:n=1;break;case p:n=3;break;case m:n=2;break;case y:var x=e[4],_=e[5],b=s(e[0]*e[0]+e[1]*e[1]),w=s(e[2]*e[2]+e[3]*e[3]),S=l(-e[1]/w,e[0]/b);f[h]*=b,f[h++]+=x,f[h]*=w,f[h++]+=_,f[h++]*=b,f[h++]*=w,f[h++]+=S,f[h++]+=S,u=h+=2;break;case g:T[0]=f[h++],T[1]=f[h++],i(T,T,e),f[u++]=T[0],f[u++]=T[1],T[0]+=f[h++],T[1]+=f[h++],i(T,T,e),f[u++]=T[0],f[u++]=T[1]}for(c=0;c<n;c++){var T;(T=o[c])[0]=f[h++],T[1]=f[h++],i(T,T,e),f[u++]=T[0],f[u++]=T[1]}}}},function(t,e,r){function n(t){i.call(this,t)}var i=r(7),a=r(3),o=r(0),s=r(11);n.prototype={constructor:n,type:"image",brush:function(t,e){var r=this.style,n=r.image;r.bind(t,this,e);var i=this._image=s.createOrUpdateImage(n,this._image,this,this.onload);if(i&&s.isImageReady(i)){var a=r.x||0,o=r.y||0,l=r.width,h=r.height,u=i.width/i.height;if(null==l&&null!=h?l=h*u:null==h&&null!=l?h=l/u:null==l&&null==h&&(l=i.width,h=i.height),this.setTransform(t),r.sWidth&&r.sHeight){var c=r.sx||0,f=r.sy||0;t.drawImage(i,c,f,r.sWidth,r.sHeight,a,o,l,h)}else if(r.sx&&r.sy){var d=l-(c=r.sx),p=h-(f=r.sy);t.drawImage(i,c,f,d,p,a,o,l,h)}else t.drawImage(i,a,o,l,h);null!=r.text&&(this.restoreTransform(t),this.drawRectText(t,this.getBoundingRect()))}},getBoundingRect:function(){var t=this.style;return this._rect||(this._rect=new a(t.x||0,t.y||0,t.width||0,t.height||0)),this._rect}},o.inherits(n,i);var l=n;t.exports=l},function(t,e,r){var n=r(0),i=r(17),a=r(3),o=function(t){for(var e in t=t||{},i.call(this,t),t)t.hasOwnProperty(e)&&(this[e]=t[e]);this._children=[],this.__storage=null,this.__dirty=!0};o.prototype={constructor:o,isGroup:!0,type:"group",silent:!1,children:function(){return this._children.slice()},childAt:function(t){return this._children[t]},childOfName:function(t){for(var e=this._children,r=0;r<e.length;r++)if(e[r].name===t)return e[r]},childCount:function(){return this._children.length},add:function(t){return t&&t!==this&&t.parent!==this&&(this._children.push(t),this._doAdd(t)),this},addBefore:function(t,e){if(t&&t!==this&&t.parent!==this&&e&&e.parent===this){var r=this._children,n=r.indexOf(e);n>=0&&(r.splice(n,0,t),this._doAdd(t))}return this},_doAdd:function(t){t.parent&&t.parent.remove(t),t.parent=this;var e=this.__storage,r=this.__zr;e&&e!==t.__storage&&(e.addToStorage(t),t instanceof o&&t.addChildrenToStorage(e)),r&&r.refresh()},remove:function(t){var e=this.__zr,r=this.__storage,i=this._children,a=n.indexOf(i,t);return a<0?this:(i.splice(a,1),t.parent=null,r&&(r.delFromStorage(t),t instanceof o&&t.delChildrenFromStorage(r)),e&&e.refresh(),this)},removeAll:function(){var t,e,r=this._children,n=this.__storage;for(e=0;e<r.length;e++)t=r[e],n&&(n.delFromStorage(t),t instanceof o&&t.delChildrenFromStorage(n)),t.parent=null;return r.length=0,this},eachChild:function(t,e){for(var r=this._children,n=0;n<r.length;n++){var i=r[n];t.call(e,i,n)}return this},traverse:function(t,e){for(var r=0;r<this._children.length;r++){var n=this._children[r];t.call(e,n),"group"===n.type&&n.traverse(t,e)}return this},addChildrenToStorage:function(t){for(var e=0;e<this._children.length;e++){var r=this._children[e];t.addToStorage(r),r instanceof o&&r.addChildrenToStorage(t)}},delChildrenFromStorage:function(t){for(var e=0;e<this._children.length;e++){var r=this._children[e];t.delFromStorage(r),r instanceof o&&r.delChildrenFromStorage(t)}},dirty:function(){return this.__dirty=!0,this.__zr&&this.__zr.refresh(),this},getBoundingRect:function(t){for(var e=null,r=new a(0,0,0,0),n=t||this._children,i=[],o=0;o<n.length;o++){var s=n[o];if(!s.ignore&&!s.invisible){var l=s.getBoundingRect(),h=s.getLocalTransform(i);h?(r.copy(l),r.applyTransform(h),(e=e||r.clone()).union(r)):(e=e||l.clone()).union(l)}}return e||r}},n.inherits(o,i);var s=o;t.exports=s},function(t,e,r){var n=r(7),i=r(0),a=r(23),o=r(22),s=r(8).ContextCachedBy,l=function(t){n.call(this,t)};l.prototype={constructor:l,type:"text",brush:function(t,e){var r=this.style;this.__dirty&&o.normalizeTextStyle(r,!0),r.fill=r.stroke=r.shadowBlur=r.shadowColor=r.shadowOffsetX=r.shadowOffsetY=null;var n=r.text;return null!=n&&(n+=""),o.needDrawText(n,r)?(this.setTransform(t),o.renderText(this,t,n,r,null,e),void this.restoreTransform(t)):void(t.__attrCachedBy=s.NONE)},getBoundingRect:function(){var t=this.style;if(this.__dirty&&o.normalizeTextStyle(t,!0),!this._rect){var e=t.text;null!=e?e+="":e="";var r=a.getBoundingRect(t.text+"",t.font,t.textAlign,t.textVerticalAlign,t.textPadding,t.textLineHeight,t.rich);if(r.x+=t.x||0,r.y+=t.y||0,o.getStroke(t.textStroke,t.textStrokeWidth)){var n=t.textStrokeWidth;r.x-=n/2,r.y-=n/2,r.width+=n,r.height+=n}this._rect=r}return this._rect}},i.inherits(l,n);var h=l;t.exports=h},function(t,e,r){var n=r(1).extend({type:"circle",shape:{cx:0,cy:0,r:0},buildPath:function(t,e,r){r&&t.moveTo(e.cx+e.r,e.cy),t.arc(e.cx,e.cy,e.r,0,2*Math.PI,!0)}});t.exports=n},function(t,e,r){var n=r(1),i=r(65),a=n.extend({type:"sector",shape:{cx:0,cy:0,r0:0,r:0,startAngle:0,endAngle:2*Math.PI,clockwise:!0},brush:i(n.prototype.brush),buildPath:function(t,e){var r=e.cx,n=e.cy,i=Math.max(e.r0||0,0),a=Math.max(e.r,0),o=e.startAngle,s=e.endAngle,l=e.clockwise,h=Math.cos(o),u=Math.sin(o);t.moveTo(h*i+r,u*i+n),t.lineTo(h*a+r,u*a+n),t.arc(r,n,a,o,s,!l),t.lineTo(Math.cos(s)*i+r,Math.sin(s)*i+n),0!==i&&t.arc(r,n,i,s,o,l),t.closePath()}});t.exports=a},function(t,e,r){var n=r(13),i=[["shadowBlur",0],["shadowColor","#000"],["shadowOffsetX",0],["shadowOffsetY",0]];t.exports=function(t){return n.browser.ie&&n.browser.version>=11?function(){var e,r=this.__clipPaths,n=this.style;if(r)for(var a=0;a<r.length;a++){var o=r[a],s=o&&o.shape,l=o&&o.type;if(s&&("sector"===l&&s.startAngle===s.endAngle||"rect"===l&&(!s.width||!s.height))){for(var h=0;h<i.length;h++)i[h][2]=n[i[h][0]],n[i[h][0]]=i[h][1];e=!0;break}}if(t.apply(this,arguments),e)for(h=0;h<i.length;h++)n[i[h][0]]=i[h][2]}:t}},function(t,e,r){var n=r(1).extend({type:"ring",shape:{cx:0,cy:0,r:0,r0:0},buildPath:function(t,e){var r=e.cx,n=e.cy,i=2*Math.PI;t.moveTo(r+e.r,n),t.arc(r,n,e.r,0,i,!1),t.moveTo(r+e.r0,n),t.arc(r,n,e.r0,0,i,!0)}});t.exports=n},function(t,e,r){var n=r(1),i=r(26),a=n.extend({type:"polygon",shape:{points:null,smooth:!1,smoothConstraint:null},buildPath:function(t,e){i.buildPath(t,e,!0)}});t.exports=a},function(t,e,r){function n(t,e,r,n,i,a,o){var s=.5*(r-t),l=.5*(n-e);return(2*(e-r)+s+l)*o+(-3*(e-r)-2*s-l)*a+s*i+e}var i=r(2).distance;t.exports=function(t,e){for(var r=t.length,a=[],o=0,s=1;s<r;s++)o+=i(t[s-1],t[s]);var l=o/2;for(l=l<r?r:l,s=0;s<l;s++){var h,u,c,f=s/(l-1)*(e?r:r-1),d=Math.floor(f),p=f-d,v=t[d%r];e?(h=t[(d-1+r)%r],u=t[(d+1)%r],c=t[(d+2)%r]):(h=t[0===d?d:d-1],u=t[d>r-2?r-1:d+1],c=t[d>r-3?r-1:d+2]);var g=p*p,y=p*g;a.push([n(h[0],v[0],u[0],c[0],p,g,y),n(h[1],v[1],u[1],c[1],p,g,y)])}return a}},function(t,e,r){var n=r(2),i=n.min,a=n.max,o=n.scale,s=n.distance,l=n.add,h=n.clone,u=n.sub;t.exports=function(t,e,r,n){var c,f,d,p,v=[],g=[],y=[],m=[];if(n){d=[1/0,1/0],p=[-1/0,-1/0];for(var x=0,_=t.length;x<_;x++)i(d,d,t[x]),a(p,p,t[x]);i(d,d,n[0]),a(p,p,n[1])}for(x=0,_=t.length;x<_;x++){var b=t[x];if(r)c=t[x?x-1:_-1],f=t[(x+1)%_];else{if(0===x||x===_-1){v.push(h(t[x]));continue}c=t[x-1],f=t[x+1]}u(g,f,c),o(g,g,e);var w=s(b,c),S=s(b,f),T=w+S;0!==T&&(w/=T,S/=T),o(y,g,-w),o(m,g,S);var M=l([],b,y),P=l([],b,m);n&&(a(M,M,d),i(M,M,p),a(P,P,d),i(P,P,p)),v.push(M),v.push(P)}return r&&v.push(v.shift()),v}},function(t,e,r){var n=r(1),i=r(26),a=n.extend({type:"polyline",shape:{points:null,smooth:!1,smoothConstraint:null},style:{stroke:"#000",fill:null},buildPath:function(t,e){i.buildPath(t,e,!1)}});t.exports=a},function(t,e,r){var n=r(1),i=r(24),a=r(27).subPixelOptimizeRect,o={},s=n.extend({type:"rect",shape:{r:0,x:0,y:0,width:0,height:0},buildPath:function(t,e){var r,n,s,l;this.subPixelOptimize?(a(o,e,this.style),r=o.x,n=o.y,s=o.width,l=o.height,o.r=e.r,e=o):(r=e.x,n=e.y,s=e.width,l=e.height),e.r?i.buildPath(t,e):t.rect(r,n,s,l),t.closePath()}});t.exports=s},function(t,e,r){var n=r(1),i=r(27).subPixelOptimizeLine,a={},o=n.extend({type:"line",shape:{x1:0,y1:0,x2:0,y2:0,percent:1},style:{stroke:"#000",fill:null},buildPath:function(t,e){var r,n,o,s;this.subPixelOptimize?(i(a,e,this.style),r=a.x1,n=a.y1,o=a.x2,s=a.y2):(r=e.x1,n=e.y1,o=e.x2,s=e.y2);var l=e.percent;0!==l&&(t.moveTo(r,n),l<1&&(o=r*(1-l)+o*l,s=n*(1-l)+s*l),t.lineTo(o,s))},pointAt:function(t){var e=this.shape;return[e.x1*(1-t)+e.x2*t,e.y1*(1-t)+e.y2*t]}});t.exports=o},function(t,e,r){function n(t,e,r){var n=t.cpx2,i=t.cpy2;return null===n||null===i?[(r?f:u)(t.x1,t.cpx1,t.cpx2,t.x2,e),(r?f:u)(t.y1,t.cpy1,t.cpy2,t.y2,e)]:[(r?c:h)(t.x1,t.cpx1,t.x2,e),(r?c:h)(t.y1,t.cpy1,t.y2,e)]}var i=r(1),a=r(2),o=r(4),s=o.quadraticSubdivide,l=o.cubicSubdivide,h=o.quadraticAt,u=o.cubicAt,c=o.quadraticDerivativeAt,f=o.cubicDerivativeAt,d=[],p=i.extend({type:"bezier-curve",shape:{x1:0,y1:0,x2:0,y2:0,cpx1:0,cpy1:0,percent:1},style:{stroke:"#000",fill:null},buildPath:function(t,e){var r=e.x1,n=e.y1,i=e.x2,a=e.y2,o=e.cpx1,h=e.cpy1,u=e.cpx2,c=e.cpy2,f=e.percent;0!==f&&(t.moveTo(r,n),null==u||null==c?(f<1&&(s(r,o,i,f,d),o=d[1],i=d[2],s(n,h,a,f,d),h=d[1],a=d[2]),t.quadraticCurveTo(o,h,i,a)):(f<1&&(l(r,o,u,i,f,d),o=d[1],u=d[2],i=d[3],l(n,h,c,a,f,d),h=d[1],c=d[2],a=d[3]),t.bezierCurveTo(o,h,u,c,i,a)))},pointAt:function(t){return n(this.shape,t,!1)},tangentAt:function(t){var e=n(this.shape,t,!0);return a.normalize(e,e)}});t.exports=p},function(t,e,r){var n=r(1).extend({type:"arc",shape:{cx:0,cy:0,r:0,startAngle:0,endAngle:2*Math.PI,clockwise:!0},style:{stroke:"#000",fill:null},buildPath:function(t,e){var r=e.cx,n=e.cy,i=Math.max(e.r,0),a=e.startAngle,o=e.endAngle,s=e.clockwise,l=Math.cos(a),h=Math.sin(a);t.moveTo(l*i+r,h*i+n),t.arc(r,n,i,a,o,!s)}});t.exports=n},function(t,e,r){var n=r(1),i=n.extend({type:"compound",shape:{paths:null},_updatePathDirty:function(){for(var t=this.__dirtyPath,e=this.shape.paths,r=0;r<e.length;r++)t=t||e[r].__dirtyPath;this.__dirtyPath=t,this.__dirty=this.__dirty||t},beforeBrush:function(){this._updatePathDirty();for(var t=this.shape.paths||[],e=this.getGlobalScale(),r=0;r<t.length;r++)t[r].path||t[r].createPathProxy(),t[r].path.setScale(e[0],e[1])},buildPath:function(t,e){for(var r=e.paths||[],n=0;n<r.length;n++)r[n].buildPath(t,r[n].shape,!0)},afterBrush:function(){for(var t=this.shape.paths||[],e=0;e<t.length;e++)t[e].__dirtyPath=!1},getBoundingRect:function(){return this._updatePathDirty(),n.prototype.getBoundingRect.call(this)}});t.exports=i},function(t,e,r){var n=r(0),i=r(28),a=function(t,e,r,n,a,o){this.x=null==t?0:t,this.y=null==e?0:e,this.x2=null==r?1:r,this.y2=null==n?0:n,this.type="linear",this.global=o||!1,i.call(this,a)};a.prototype={constructor:a},n.inherits(a,i);var o=a;t.exports=o},function(t,e,r){var n=r(0),i=r(28),a=function(t,e,r,n,a){this.x=null==t?.5:t,this.y=null==e?.5:e,this.r=null==r?.5:r,this.type="radial",this.global=a||!1,i.call(this,n)};a.prototype={constructor:a},n.inherits(a,i);var o=a;t.exports=o},function(t,e,r){function n(t){a.call(this,t),this._displayables=[],this._temporaryDisplayables=[],this._cursor=0,this.notClear=!0}var i=r(0).inherits,a=r(7),o=r(3);n.prototype.incremental=!0,n.prototype.clearDisplaybles=function(){this._displayables=[],this._temporaryDisplayables=[],this._cursor=0,this.dirty(),this.notClear=!1},n.prototype.addDisplayable=function(t,e){e?this._temporaryDisplayables.push(t):this._displayables.push(t),this.dirty()},n.prototype.addDisplayables=function(t,e){e=e||!1;for(var r=0;r<t.length;r++)this.addDisplayable(t[r],e)},n.prototype.eachPendingDisplayable=function(t){for(var e=this._cursor;e<this._displayables.length;e++)t&&t(this._displayables[e]);for(e=0;e<this._temporaryDisplayables.length;e++)t&&t(this._temporaryDisplayables[e])},n.prototype.update=function(){this.updateTransform();for(var t=this._cursor;t<this._displayables.length;t++){(e=this._displayables[t]).parent=this,e.update(),e.parent=null}for(t=0;t<this._temporaryDisplayables.length;t++){var e;(e=this._temporaryDisplayables[t]).parent=this,e.update(),e.parent=null}},n.prototype.brush=function(t,e){for(var r=this._cursor;r<this._displayables.length;r++){(n=this._displayables[r]).beforeBrush&&n.beforeBrush(t),n.brush(t,r===this._cursor?null:this._displayables[r-1]),n.afterBrush&&n.afterBrush(t)}this._cursor=r;for(r=0;r<this._temporaryDisplayables.length;r++){var n;(n=this._temporaryDisplayables[r]).beforeBrush&&n.beforeBrush(t),n.brush(t,0===r?null:this._temporaryDisplayables[r-1]),n.afterBrush&&n.afterBrush(t)}this._temporaryDisplayables=[],this.notClear=!0};var s=[];n.prototype.getBoundingRect=function(){if(!this._rect){for(var t=new o(1/0,1/0,-1/0,-1/0),e=0;e<this._displayables.length;e++){var r=this._displayables[e],n=r.getBoundingRect().clone();r.needLocalTransform()&&n.applyTransform(r.getLocalTransform(s)),t.union(n)}this._rect=t}return this._rect},n.prototype.contain=function(t,e){var r=this.transformCoordToLocal(t,e);if(this.getBoundingRect().contain(r[0],r[1]))for(var n=0;n<this._displayables.length;n++){if(this._displayables[n].contain(t,e))return!0}return!1},i(n,a);var l=n;t.exports=l},function(t,e,r){function n(t,e,r,n){return 0===e?[[t+.5*r/Math.PI/2,n/2],[t+.5*r/Math.PI,n],[t+r/4,n]]:1===e?[[t+.5*r/Math.PI/2*(Math.PI-2),n],[t+.5*r/Math.PI/2*(Math.PI-1),n/2],[t+r/4,0]]:2===e?[[t+.5*r/Math.PI/2,-n/2],[t+.5*r/Math.PI,-n],[t+r/4,-n]]:[[t+.5*r/Math.PI/2*(Math.PI-2),-n],[t+.5*r/Math.PI/2*(Math.PI-1),-n/2],[t+r/4,0]]}var i=r(5);t.exports=i.graphic.extendShape({type:"ec-liquid-fill",shape:{waveLength:0,radius:0,radiusY:0,cx:0,cy:0,waterLevel:0,amplitude:0,phase:0,inverse:!1},buildPath:function(t,e){null==e.radiusY&&(e.radiusY=e.radius);for(var r=Math.max(2*Math.ceil(2*e.radius/e.waveLength*4),8);e.phase<2*-Math.PI;)e.phase+=2*Math.PI;for(;e.phase>0;)e.phase-=2*Math.PI;var i=e.phase/Math.PI/2*e.waveLength,a=e.cx-e.radius+i-2*e.radius;t.moveTo(a,e.waterLevel);for(var o=0,s=0;s<r;++s){var l=s%4,h=n(s*e.waveLength/4,l,e.waveLength,e.amplitude);t.bezierCurveTo(h[0][0]+a,-h[0][1]+e.waterLevel,h[1][0]+a,-h[1][1]+e.waterLevel,h[2][0]+a,-h[2][1]+e.waterLevel),s===r-1&&(o=h[2][0])}e.inverse?(t.lineTo(o+a,e.cy-e.radiusY),t.lineTo(a,e.cy-e.radiusY),t.lineTo(a,e.waterLevel)):(t.lineTo(o+a,e.cy+e.radiusY),t.lineTo(a,e.cy+e.radiusY),t.lineTo(a,e.waterLevel)),t.closePath()}})},function(t,e,r){var n=r(0).createHashMap;t.exports=function(t){return{getTargetSeries:function(e){var r={},i=n();return e.eachSeriesByType(t,function(t){t.__paletteScope=r,i.set(t.uid,t)}),i},reset:function(t,e){var r=t.getRawData(),n={},i=t.getData();i.each(function(t){var e=i.getRawIndex(t);n[e]=t}),r.each(function(e){var a=n[e],o=null!=a&&i.getItemVisual(a,"color",!0);if(o)r.setItemVisual(e,"color",o);else{var s=r.getItemModel(e).get("itemStyle.color")||t.getColorFromPalette(r.getName(e)||e+"",t.__paletteScope,r.count());r.setItemVisual(e,"color",s),null!=a&&i.setItemVisual(a,"color",s)}})}}}}])});
2 | //# sourceMappingURL=echarts-liquidfill.min.js.map


--------------------------------------------------------------------------------
/app/static/images/face.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thznote/monitor-python/5c5cb16ebc693734ec4df07e892ab3f60cf20c55/app/static/images/face.png


--------------------------------------------------------------------------------
/app/static/images/qq.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thznote/monitor-python/5c5cb16ebc693734ec4df07e892ab3f60cf20c55/app/static/images/qq.jpg


--------------------------------------------------------------------------------
/app/static/images/qq_group.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thznote/monitor-python/5c5cb16ebc693734ec4df07e892ab3f60cf20c55/app/static/images/qq_group.jpg


--------------------------------------------------------------------------------
/app/static/images/weixin.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thznote/monitor-python/5c5cb16ebc693734ec4df07e892ab3f60cf20c55/app/static/images/weixin.jpg


--------------------------------------------------------------------------------
/app/static/js/analogClock.js:
--------------------------------------------------------------------------------
  1 | function AnalogClockOption(width, foreColor, bgColor) {
  2 |     this.foreColor = foreColor ? foreColor : "#000";
  3 |     this.bgColor = bgColor ? bgColor : "#eee";
  4 |     this.width = width ? width : 400;
  5 | }
  6 | 
  7 | function AnalogClock(id, option) {
  8 | 
  9 |     let dateTimeFormat = function (time) {
 10 |         let str = "";
 11 |         str += time.getYear() + (time.getYear() > 1900 ? 0 : 1900) + "-";
 12 |         str += time.getMonth() + 1 + "-";
 13 |         str += time.getDate() + "<br/> ";
 14 |         str += time.getHours() + ":";
 15 |         str += time.getMinutes() + ":";
 16 |         str += time.getSeconds();
 17 |         return str;
 18 |     };
 19 | 
 20 |     if (!option)
 21 |         option = {};
 22 |     this.foreColor = option.foreColor ? option.foreColor : "#000";
 23 |     this.bgColor = option.bgColor ? option.bgColor : "#eee";
 24 |     this.width = option.width ? option.width : 400;
 25 | 
 26 |     this.container = document.getElementById(id);
 27 |     if (!this.container)
 28 |         return;
 29 |     this.container.style.fontcolor = this.foreColor;
 30 | 
 31 |     this.panel = document.createElement("div");
 32 |     this.panel.style.borderRadius = "50%";
 33 |     this.panel.style.backgroundColor = this.bgColor;
 34 |     this.panel.style.border = "solid 1px #ccc";
 35 |     this.panel.style.width = this.width + "px";
 36 |     this.panel.style.height = this.width + "px";
 37 |     this.panel.style.position = "relative";
 38 |     this.panel.style.marginLeft = "auto";
 39 |     this.panel.style.marginRight = "auto";
 40 |     this.container.appendChild(this.panel);
 41 | 
 42 |     let label = document.createElement("h4");
 43 |     label.style.width = "100%";
 44 |     label.style.textAlign = "center";
 45 |     label.style.fontWeight = "normal";
 46 |     label.style.fontSize = this.width / 15 + "px";
 47 |     label.style.marginTop = this.width * 0.6 + "px";
 48 |     label.style.color = this.foreColor;
 49 |     label.innerHTML = dateTimeFormat(new Date());
 50 |     if (this.width >= 100)
 51 |         this.panel.appendChild(label);
 52 | 
 53 |     let ul = document.createElement("ul");
 54 |     ul.style.height = "100%";
 55 | 
 56 |     ul.style.padding = "0";
 57 |     ul.style.margin = "0";
 58 |     ul.style.listStyle = "none";
 59 |     ul.style.position = "absolute";
 60 |     ul.style.width = 40 + "px";
 61 |     ul.style.top = 0;
 62 |     ul.style.left = this.width / 2 - 20 + "px";
 63 |     ul.style.color = this.foreColor;
 64 |     this.panel.appendChild(ul);
 65 | 
 66 |     for (let i = 0; i <= 5; i++) {
 67 |         if (!localStorage)
 68 |             break;
 69 | 
 70 |         let list = document.createElement("li");
 71 |         list.style.padding = "0";
 72 |         list.style.margin = "0";
 73 |         list.style.position = "absolute";
 74 |         list.style.textAlign = "center";
 75 |         list.style.width = "40px";
 76 |         list.style.height = this.width + "px";
 77 |         list.style.fontSize = this.width / 10 + "px";
 78 |         ul.appendChild(list);
 79 | 
 80 |         list.style.transform = "rotate(" + 360 / 12 * (i + 1) + "deg)";
 81 | 
 82 |         let numTop = document.createElement("div");
 83 |         numTop.style.width = "100%";
 84 |         numTop.style.position = "absolute";
 85 |         numTop.style.textAlign = "center";
 86 |         numTop.innerHTML = i + 1;
 87 |         if (this.width < 100)
 88 |             numTop.innerHTML = "●";
 89 |         list.appendChild(numTop);
 90 | 
 91 |         numTop.style.transform = "rotate(" + -360 / 12 * (i + 1) + "deg)";
 92 | 
 93 |         let numBottom = document.createElement("div");
 94 |         numBottom.style.width = "100%";
 95 |         numBottom.style.position = "absolute";
 96 |         numBottom.style.textAlign = "center";
 97 |         numBottom.style.bottom = "0";
 98 |         numBottom.innerHTML = i + 7;
 99 |         if (this.width < 100)
100 |             numBottom.innerHTML = "●";
101 |         list.appendChild(numBottom);
102 | 
103 |         numBottom.style.transform = "rotate(" + -360 / 12 * (i + 1) + "deg)";
104 |     }
105 | 
106 |     let hour = document.createElement("div");
107 |     let hourWidth = this.width * 0.02;
108 |     let hourTop = this.width * 0.25 - (hourWidth * 0.5);
109 |     let hourleft = this.width * 0.5 - hourWidth * 0.5;
110 |     hour.style.width = hourWidth + "px";
111 |     hour.style.height = hourWidth + "px";
112 |     hour.style.position = "absolute";
113 |     hour.style.border = "solid 0px transparent";
114 |     hour.style.left = hourleft + "px";
115 |     hour.style.top = hourTop + "px";
116 |     hour.style.borderTop = "solid " + (this.width * 0.5 - hourTop) + "px #f60";
117 |     hour.style.borderBottomWidth = (this.width * 0.5 - hourTop) + "px";
118 |     if (localStorage)
119 |         this.panel.appendChild(hour);
120 | 
121 |     let min = document.createElement("div");
122 |     let minWidth = this.width * 0.01;
123 |     let minTop = this.width * 0.1 - (minWidth * 0.5);
124 |     let minleft = this.width * 0.5 - minWidth * 0.5;
125 |     min.style.width = minWidth + "px";
126 |     min.style.height = minWidth + "px";
127 |     min.style.position = "absolute";
128 |     min.style.border = "solid 0px transparent";
129 |     min.style.left = minleft + "px";
130 |     min.style.top = minTop + "px";
131 |     min.style.borderTop = "solid " + (this.width * 0.5 - minTop) + "px #09f";
132 |     min.style.borderBottomWidth = (this.width * 0.5 - minTop) + "px";
133 |     if (localStorage)
134 |         this.panel.appendChild(min);
135 | 
136 |     let sec = document.createElement("div");
137 |     let secWidth = 1;
138 |     let secTop = this.width * 0.05;
139 |     sec.style.width = secWidth + "px";
140 |     sec.style.height = secWidth + "px";
141 |     sec.style.position = "absolute";
142 |     sec.style.border = "solid 0px transparent";
143 |     sec.style.left = (this.width * 0.5 - secWidth) + "px";
144 |     sec.style.top = secTop + "px";
145 |     sec.style.borderTop = "solid " + (this.width * 0.5 - secTop) + "px " + this.foreColor;
146 |     sec.style.borderBottomWidth = (this.width * 0.5 - secTop) + "px";
147 |     if (localStorage)
148 |         this.panel.appendChild(sec);
149 | 
150 |     let point = document.createElement("div");
151 |     let pointWidth = this.width * 0.05;
152 |     point.style.width = pointWidth + "px";
153 |     point.style.height = pointWidth + "px";
154 |     point.style.position = "absolute";
155 |     point.style.backgroundColor = this.foreColor;
156 |     point.style.left = this.width * 0.5 - (pointWidth * 0.5) + "px";
157 |     point.style.top = this.width * 0.5 - (pointWidth * 0.5) + "px";
158 |     point.style.borderRadius = "50%";
159 |     if (localStorage)
160 |         this.panel.appendChild(point);
161 | 
162 |     this.loop = setInterval(function () {
163 |         let now = new Date();
164 |         label.innerHTML = dateTimeFormat(now);
165 | 
166 |         let roS = 1.0 * 360 / 60 * now.getSeconds();
167 |         let roM = 1.0 * 360 / 60 * now.getMinutes();
168 |         let roH = 1.0 * 360 / 12 * (now.getHours() % 12) + 1.0 * 360 / 12 * (now.getMinutes() / 60);
169 | 
170 |         sec.style.transform = 'rotate(' + roS + 'deg)';
171 |         min.style.transform = 'rotate(' + roM + 'deg)';
172 |         hour.style.transform = 'rotate(' + roH + 'deg)';
173 |     }, 1000);
174 | }
175 | 


--------------------------------------------------------------------------------
/app/static/js/monitor.js:
--------------------------------------------------------------------------------
  1 | if (!window.WebSocket) {
  2 |     window.WebSocket = window.MozWebSocket;
  3 | }
  4 | 
  5 | //1.定义长连接
  6 | let conn = null;
  7 | 
  8 | //进度条变化
  9 | function progress_status(val) {
 10 |     let data = "";
 11 |     if (val >= 0 && val < 25) {
 12 |         data = " bg-success";
 13 |     } else if (val >= 25 && val < 50) {
 14 |         data = "";
 15 |     } else if (val >= 50 && val < 75) {
 16 |         data = " bg-warning";
 17 |     } else if (val >= 75 && val <= 100) {
 18 |         data = " bg-success";
 19 |     }
 20 |     return data
 21 | }
 22 | 
 23 | //连接提示信息
 24 | function log(cls, msg) {
 25 |     document.getElementById("monitor_status").innerHTML = "<div class='alert alert-" + cls + "'>" + msg + "</div>";
 26 | }
 27 | 
 28 | //专门实时更新信息
 29 | function update_ui(e) {
 30 |     let data = e.data;
 31 |     data = JSON.parse(data); //把json字符串转化为对象
 32 |     /*平均CPU*/
 33 |     option_cpu_avg.series[0].data[0] = (data['cpu']['percent_avg'] / 100).toFixed(4);
 34 |     option_cpu_avg.title[0].text = data['dt'] + "-CPU平均使用率";
 35 |     chart_cpu_avg.setOption(option_cpu_avg);
 36 |     /*单独CPU*/
 37 |     let cpu_per = "";
 38 |     for (let k in data['cpu']['percent_per']) {
 39 |         let num = parseInt(k);
 40 |         cpu_per += "<tr><td class='text-primary' style='width: 30%'>CPU" + num + "</td>";
 41 |         cpu_per += "<td><div class='progress'><div class='progress-bar progress-bar-striped progress-bar-animated" + progress_status(data['cpu']['percent_per'][k]) + "' role='progressbar' aria-valuenow='" + data['cpu']['percent_per'][k] + "' aria-valuemin='0' aria-valuemax='100' style='width: " + data['cpu']['percent_per'][k] + "%'>" + data['cpu']['percent_per'][k] + "%</div></div></td></tr>";
 42 |     }
 43 |     document.getElementById("tb_cpu_per").innerHTML = cpu_per;
 44 |     /*内存实时更新*/
 45 |     option_mem.series[0].data[0].value = data['mem']['percent'];
 46 |     option_mem.title[0].text = data["dt"] + "-内存使用率";
 47 |     chart_mem.setOption(option_mem);
 48 |     document.getElementById("mem_percent").innerText = data['mem']['percent'];
 49 |     document.getElementById("mem_total").innerText = data['mem']['total'];
 50 |     document.getElementById("mem_used").innerText = data['mem']['used'];
 51 |     document.getElementById("mem_free").innerText = data['mem']['free'];
 52 | 
 53 |     /*交换分区实时更新*/
 54 |     option_swap.series[0].data[0].value = data['swap']['percent'];
 55 |     option_swap.title[0].text = data["dt"] + "-交换分区使用率";
 56 |     chart_swap.setOption(option_swap);
 57 |     document.getElementById("swap_percent").innerText = data['swap']['percent'];
 58 |     document.getElementById("swap_total").innerText = data['swap']['total'];
 59 |     document.getElementById("swap_used").innerText = data['swap']['used'];
 60 |     document.getElementById("swap_free").innerText = data['swap']['free'];
 61 | 
 62 |     /*网络信息更新*/
 63 |     let net = "";
 64 |     for (let k in data['net']) {
 65 |         let cd = data['net'][k];
 66 |         if (parseInt(cd['bytes_sent']) != 0 && parseInt(cd["bytes_recv"]) != 0) {
 67 |             let index = parseInt(k) + 1;
 68 |             let op = eval("option_net" + index);
 69 |             let ch = eval("chart_net" + index);
 70 |             op.title[0].text = data["dt"] + "-" + cd["name"] + "网卡信息";
 71 |             op.series[0].data = [
 72 |                 {"name": "收包数", "value": cd["packets_recv"]},
 73 |                 {"name": "发包数", "value": cd["packets_sent"]}
 74 |             ];
 75 |             op.series[1].data = [
 76 |                 {"name": "收字节", "value": cd["bytes_recv"]},
 77 |                 {"name": "发字节", "value": cd["bytes_sent"]}
 78 |             ];
 79 |             ch.setOption(op);
 80 |         }
 81 |         net += "<tr><td>" + cd['name'] + "</td>";
 82 |         net += "<td class='text-danger'>" + cd['bytes_sent'] + "</td>";
 83 |         net += "<td class='text-danger'>" + cd['bytes_recv'] + "</td>";
 84 |         net += "<td class='text-danger'>" + cd['packets_sent'] + "</td>";
 85 |         net += "<td class='text-danger'>" + cd['packets_recv'] + "</td>";
 86 |         net += "<td>" + cd['family'] + "</td>";
 87 |         net += "<td>" + cd['address'] + "</td>";
 88 |         net += "<td>" + cd['netmask'] + "</td>";
 89 |         if (cd['broadcast']) {
 90 |             net += "<td>" + cd['broadcast'] + "</td></tr>";
 91 |         } else {
 92 |             net += "<td>无</td></tr>";
 93 |         }
 94 |     }
 95 |     document.getElementById("tb_net").innerHTML = net;
 96 | 
 97 |     /*磁盘使用信息实时更新*/
 98 |     let disk = "";
 99 |     for (let k in data["disk"]) {
100 |         let cd = data["disk"][k];
101 |         disk += "<tr><td>" + cd['device'] + "</td>";
102 |         disk += "<td>" + cd['mountpoint'] + "</td>";
103 |         disk += "<td>" + cd['fstype'] + "</td>";
104 |         disk += "<td>" + cd['opts'] + "</td>";
105 |         disk += "<td class='text-danger'>" + cd['used']['total'] + "GB</td>";
106 |         disk += "<td class='text-danger'>" + cd['used']['used'] + "GB</td>";
107 |         disk += "<td class='text-danger'>" + cd['used']['free'] + "GB</td>";
108 |         disk += "<td><div class='progress'><div class='progress-bar progress-bar-striped progress-bar-animated" + progress_status(cd['used']['percent']) + "' role='progressbar' aria-valuenow='" + cd['used']['percent'] + "' aria-valuemin='0' aria-valuemax='100' style='width: " + cd['used']['percent'] + "%'>" + cd['used']['percent'] + "%</div></div></td></tr>";
109 |     }
110 |     document.getElementById("tb_disk").innerHTML = disk;
111 | }
112 | 
113 | //2.定义连接函数
114 | function connect() {
115 |     disconnect();//把之前没关闭的连接关闭掉，再创建新的连接
116 |     //创建连接对象
117 |     conn = new WebSocket(`ws://${window.location.host}/real/time/`);
118 |     log("warning", "正在连接....");
119 |     //建立连接
120 |     conn.onopen = function () {
121 |         console.log("连接成功！");
122 |         log("success", "连接成功！");
123 |     };
124 |     //建立接受消息
125 |     conn.onmessage = function (e) {
126 |         //console.log(e.data)
127 |         update_ui(e);
128 |     };
129 |     //建立关闭连接
130 |     conn.onclose = function () {
131 |         console.log("连接断开！");
132 |         log("danger", "连接断开！");
133 |     };
134 |     //每隔几秒触发一个事件
135 |     setInterval(function () {
136 |         conn.send("system");
137 |     }, 500);
138 | }
139 | 
140 | //3.定义断开连接函数
141 | function disconnect() {
142 |     if (conn != null) {
143 |         log("danger", "连接断开！");
144 |         conn.close(); //关闭连接
145 |         conn = null;
146 |     }
147 | }
148 | 
149 | //4.刷新页面时候，断开连接，重新连接，断线重连判断
150 | if (conn == null) {
151 |     connect()
152 | } else {
153 |     disconnect();
154 | }
155 | 


--------------------------------------------------------------------------------
/app/templates/index.html:
--------------------------------------------------------------------------------
  1 | <!--继承布局文件-->
  2 | {% extends "layout.html" %}
  3 | 
  4 | {% block head %}
  5 | <script src="{{ static_url('echarts-liquidfill/echarts-liquidfill.min.js') }}"></script>
  6 | {% end %}
  7 | 
  8 | {% block content %}
  9 | <!--内容部分-->
 10 | <div class="row">
 11 |     <div class="col-md-12" id="monitor_status"></div>
 12 |     <div class="col-md-12">
 13 |         <div class="card text-white bg-dark mb-3">
 14 |             <div class="card-header">CPU信息</div>
 15 |             <div class="card-body">
 16 |                 <div class="row">
 17 |                     <!--栅格系统，12，打出2列表，6、6-->
 18 |                     <div class="col-md-6 pad-right">
 19 |                         <div class="border border-white">{% raw data['cpu_liquid'] %}</div>
 20 |                     </div>
 21 |                     <div class="col-md-6 pad-left">
 22 |                         <table class="table table-sm table-bordered">
 23 |                             <thead>
 24 |                             <th class="text-center" colspan="2">
 25 |                                 所有CPU使用率
 26 |                             </th>
 27 |                             </thead>
 28 |                             <tbody id="tb_cpu_per">
 29 |                             {% for k,v in enumerate(data['cpu_info']['percent_per']) %}
 30 |                             <tr>
 31 |                                 <td class="text-primary" style="width: 30%">
 32 |                                     CPU{{ k }}
 33 |                                 </td>
 34 |                                 <td>
 35 |                                     <div class="progress">
 36 |                                         <div class="progress-bar progress-bar-striped progress-bar-animated{{ handler.progress_status(v) }}"
 37 |                                              role="progressbar" aria-valuenow="{{ v }}" aria-valuemin="0"
 38 |                                              aria-valuemax="100" style="width: {{ v }}%">{{ v }}%
 39 |                                         </div>
 40 |                                     </div>
 41 |                                 </td>
 42 |                             </tr>
 43 |                             {% end %}
 44 |                             </tbody>
 45 |                         </table>
 46 |                     </div>
 47 |                 </div>
 48 |             </div>
 49 |         </div>
 50 |     </div>
 51 |     <div class="col-md-12">
 52 |         <div class="card text-white bg-dark mb-3">
 53 |             <div class="card-header">内存/交换分区信息</div>
 54 |             <div class="card-body">
 55 |                 <div class="row">
 56 |                     <div class="col-md-6 pad-right">
 57 |                         <div class="border border-white">{% raw data['mem_gauge'] %}</div>
 58 |                         <table class="table table-sm table-bordered">
 59 |                             <tr>
 60 |                                 <td class="text-primary" style="width: 30%">使用率（%）</td>
 61 |                                 <td id="mem_percent" class="text-danger">{{ data['mem_info']['percent'] }}</td>
 62 |                             </tr>
 63 |                             <tr>
 64 |                                 <td class="text-primary" style="width: 30%">总量（GB）</td>
 65 |                                 <td id="mem_total" class="text-danger">{{ data['mem_info']['total'] }}</td>
 66 |                             </tr>
 67 |                             <tr>
 68 |                                 <td class="text-primary" style="width: 30%">使用量（GB）</td>
 69 |                                 <td id="mem_used" class="text-danger">{{ data['mem_info']['used'] }}</td>
 70 |                             </tr>
 71 |                             <tr>
 72 |                                 <td class="text-primary" style="width: 30%">剩余量（GB）</td>
 73 |                                 <td id="mem_free" class="text-danger">{{ data['mem_info']['free'] }}</td>
 74 |                             </tr>
 75 |                         </table>
 76 |                     </div>
 77 |                     <div class="col-md-6 pad-left">
 78 |                         <div class="border border-white">{% raw data['swap_gauge'] %}</div>
 79 |                         <table class="table table-sm table-bordered">
 80 |                             <tr>
 81 |                                 <td class="text-primary" style="width: 30%">使用率（%）</td>
 82 |                                 <td id="swap_percent" class="text-danger">{{ data['swap_info']['percent'] }}</td>
 83 |                             </tr>
 84 |                             <tr>
 85 |                                 <td class="text-primary" style="width: 30%">总量（GB）</td>
 86 |                                 <td id="swap_total" class="text-danger">{{ data['swap_info']['total'] }}</td>
 87 |                             </tr>
 88 |                             <tr>
 89 |                                 <td class="text-primary" style="width: 30%">使用量（GB）</td>
 90 |                                 <td id="swap_used" class="text-danger">{{ data['swap_info']['used'] }}</td>
 91 |                             </tr>
 92 |                             <tr>
 93 |                                 <td class="text-primary" style="width: 30%">剩余量（GB）</td>
 94 |                                 <td id="swap_free" class="text-danger">{{ data['swap_info']['free'] }}</td>
 95 |                             </tr>
 96 |                         </table>
 97 |                     </div>
 98 |                 </div>
 99 |             </div>
100 |         </div>
101 |     </div>
102 |     <div class="col-md-12">
103 |         <div class="card text-white bg-dark mb-3">
104 |             <div class="card-header">网络信息</div>
105 |             <div class="card-body">
106 |                 <div class="row">
107 |                     {% for v in data['net_pie'] %}
108 |                     <div class="col-md-12">
109 |                         <div class="border border-white">{% raw v %}</div>
110 |                     </div>
111 |                     {% end %}
112 |                     <div class="col-md-12">
113 |                         <table class="table table-sm table-bordered">
114 |                             <thead>
115 |                             <tr class="text-primary">
116 |                                 <th style="width: 20%">网卡名称</th>
117 |                                 <th style="width: 10%">发送字节</th>
118 |                                 <th style="width: 10%">接收字节</th>
119 |                                 <th style="width: 10%">发送包数</th>
120 |                                 <th style="width: 10%">接收包数</th>
121 |                                 <th style="width: 10%">协议地址族</th>
122 |                                 <th style="width: 10%">IP地址</th>
123 |                                 <th style="width: 10%">子网掩码</th>
124 |                                 <th style="width: 10%">广播地址</th>
125 |                             </tr>
126 |                             </thead>
127 |                             <tbody id="tb_net">
128 |                             {% for v in data['net_info'] %}
129 |                             <tr>
130 |                                 <td>{{ v['name'] }}</td>
131 |                                 <td class="text-danger">{{ v['bytes_sent'] }}</td>
132 |                                 <td class="text-danger">{{ v['bytes_recv'] }}</td>
133 |                                 <td class="text-danger">{{ v['packets_sent'] }}</td>
134 |                                 <td class="text-danger">{{ v['packets_recv'] }}</td>
135 |                                 <td>{{ v['family'] }}</td>
136 |                                 <td>{{ v['address'] }}</td>
137 |                                 <td>{{ v['netmask'] }}</td>
138 |                                 <td>
139 |                                     {% if v['broadcast'] %}
140 |                                     {{ v['broadcast'] }}
141 |                                     {% else %}
142 |                                     无
143 |                                     {% end %}
144 |                                 </td>
145 |                             </tr>
146 |                             {% end %}
147 |                             </tbody>
148 |                         </table>
149 |                     </div>
150 |                 </div>
151 |             </div>
152 |         </div>
153 |     </div>
154 |     <div class="col-md-12">
155 |         <div class="card text-white bg-dark mb-3">
156 |             <div class="card-header">磁盘使用信息</div>
157 |             <div class="card-body">
158 |                 <table class="table table-sm table-bordered">
159 |                     <thead>
160 |                     <tr class="text-primary">
161 |                         <th style="width: 10%">设备名称</th>
162 |                         <th style="width: 10%">挂载点</th>
163 |                         <th style="width: 10%">文件系统类型</th>
164 |                         <th style="width: 10%">操作选项</th>
165 |                         <th style="width: 10%">总量（GB）</th>
166 |                         <th style="width: 10%">使用量（GB）</th>
167 |                         <th style="width: 10%">剩余量（GB）</th>
168 |                         <th style="width: 30%">使用量（%）</th>
169 |                     </tr>
170 |                     </thead>
171 |                     <tbody id="tb_disk">
172 |                     {% for v in data['disk_info'] %}
173 |                     <tr>
174 |                         <td>{{ v['device'] }}</td>
175 |                         <td>{{ v['mountpoint'] }}</td>
176 |                         <td>{{ v['fstype'] }}</td>
177 |                         <td>{{ v['opts'] }}</td>
178 |                         <td class="text-danger">{{ v['used']['total'] }}GB</td>
179 |                         <td class="text-danger">{{ v['used']['used'] }}GB</td>
180 |                         <td class="text-danger">{{ v['used']['free'] }}GB</td>
181 |                         <td>
182 |                             <div class="progress">
183 |                                 <div class="progress-bar progress-bar-striped progress-bar-animated{{ handler.progress_status(v['used']['percent']) }}"
184 |                                      role="progressbar" aria-valuenow="{{ v['used']['percent'] }}" aria-valuemin="0"
185 |                                      aria-valuemax="100"
186 |                                      style="width: {{ v['used']['percent'] }}%">{{ v['used']['percent'] }}%
187 |                                 </div>
188 |                             </div>
189 |                         </td>
190 |                     </tr>
191 |                     {% end %}
192 |                     </tbody>
193 |                 </table>
194 |             </div>
195 |         </div>
196 |     </div>
197 | </div>
198 | {% end %}
199 | 
200 | 


--------------------------------------------------------------------------------
/app/templates/layout.html:
--------------------------------------------------------------------------------
  1 | <!doctype html>
  2 | <html lang="en">
  3 | <head>
  4 |     <meta charset="utf-8">
  5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6 |     <meta name="description" content="硬件实时监控,CPU,内存,磁盘,网络">
  7 |     <meta name="author" content="张金龙">
  8 |     <title>硬件实时监控</title>
  9 |     <link href="{{ static_url('dist/css/bootstrap.min.css') }}" rel="stylesheet">
 10 |     <link href="{{ static_url('css/dashboard.css') }}" rel="stylesheet">
 11 |     <script src="{{ static_url('js/analogClock.js') }}"></script>
 12 |     <script src="https://cdn.bootcss.com/echarts/4.2.1/echarts.min.js"></script>
 13 |     <!--头部数据块-->
 14 |     {% block head %}{% end %}
 15 | </head>
 16 | 
 17 | <body>
 18 | <nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow">
 19 |     <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="#">硬件实时监控</a>
 20 | </nav>
 21 | 
 22 | <div class="container-fluid">
 23 |     <div class="row">
 24 |         <nav class="col-md-2 d-none d-md-block bg-light sidebar">
 25 |             <div class="sidebar-sticky">
 26 |                 <ul class="nav flex-column">
 27 |                     <li class="nav-item">
 28 |                         <a class="nav-link active" href="/">
 29 |                             系统监控
 30 |                         </a>
 31 |                     </li>
 32 |                     <li class="nav-item">
 33 |                         <a class="nav-link active" href="/log/">
 34 |                             日志统计
 35 |                         </a>
 36 |                     </li>
 37 |                 </ul>
 38 |                 <div class="col-md-12">
 39 |                     <div class="alert alert-info">开机时间：{{ handler.started }}</div>
 40 |                 </div>
 41 |                 <div class="col-md-12">
 42 |                     <div class="card text-white bg-dark mb-3">
 43 |                         <div class="card-header">当前时间</div>
 44 |                         <div class="card-body" id="clock"></div>
 45 |                     </div>
 46 |                 </div>
 47 |                 <div class="col-md-12">
 48 |                     <div class="card text-white bg-dark mb-3">
 49 |                         <div class="card-header">用户信息</div>
 50 |                         <div class="card-body">
 51 |                             <table class="table table-sm table-bordered">
 52 |                                 <thead>
 53 |                                 <tr class="text-primary">
 54 |                                     <th class="text-center" colspan="2">
 55 |                                         登录用户信息
 56 |                                     </th>
 57 |                                 </tr>
 58 |                                 </thead>
 59 |                                 <tbody>
 60 |                                 {% for v in handler.users %}
 61 |                                 <tr>
 62 |                                     <td class="text-primary">
 63 |                                         登录账号：<br>
 64 |                                         登录终端：<br>
 65 |                                         登录主机：<br>
 66 |                                         登录时间：
 67 |                                     </td>
 68 |                                     <td>
 69 |                                         {{ v['name'] }}<br>
 70 |                                         {{ v['terminal'] }}<br>
 71 |                                         {{ v['host'] }}<br>
 72 |                                         {{ v['started'] }}
 73 |                                     </td>
 74 |                                 </tr>
 75 |                                 {% end %}
 76 |                                 </tbody>
 77 |                             </table>
 78 |                         </div>
 79 |                     </div>
 80 |                 </div>
 81 |             </div>
 82 |         </nav>
 83 | 
 84 |         <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
 85 |             <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
 86 |                 <h5>{{ data['title'] }}</h5>
 87 |             </div>
 88 |             <!--变化的部分放在该数据块中-->
 89 |             {% block content %}{% end %}
 90 |             <div class="jumbotron foot-section">
 91 |                 <hr class="my-4">
 92 |                 <div class="container">
 93 |                     <div class="row">
 94 |                         <div class="col-md-2">
 95 |                             <img data-src="{{ static_url('images/face.png') }}"
 96 |                                  class="lazyload blur-up img-fluid mx-auto d-block">
 97 |                         </div>
 98 |                         <div class="col-md-4">
 99 |                             <h5>张金龙</h5>
100 |                             <p class="info-text">— 人生苦短，我用Python！</p>
101 |                             <p class="info-text">微信：13700632835</p>
102 |                             <p class="info-text">手机：13700632835</p>
103 |                             <p class="info-text">邮箱：1780316635@qq.com</p>
104 |                             <p class="info-text">编程爱好者，多年丰富的项目经验，擅长python、php、golang、centos、reactnative等技术。</p>
105 |                         </div>
106 |                         <div class="col-md-6">
107 |                             <div class="row">
108 |                                 <div class="col-md-4">
109 |                                     <p class="text-center info-text">站长微信</p>
110 |                                     <img data-src="{{ static_url('images/weixin.jpg') }}"
111 |                                          class="lazyload blur-up img-fluid mx-auto d-block">
112 |                                 </div>
113 |                                 <div class="col-md-4">
114 |                                     <p class="text-center info-text">站长QQ</p>
115 |                                     <img data-src="{{ static_url('images/qq.jpg') }}"
116 |                                          class="lazyload blur-up img-fluid mx-auto d-block">
117 |                                 </div>
118 |                                 <div class="col-md-4">
119 |                                     <p class="text-center info-text">python问答QQ群</p>
120 |                                     <img data-src="{{ static_url('images/qq_group.jpg') }}"
121 |                                          class="lazyload blur-up img-fluid mx-auto d-block">
122 |                                 </div>
123 |                             </div>
124 |                         </div>
125 |                     </div>
126 |                 </div>
127 |                 <hr class="my-4">
128 |                 <div class="container">
129 |                     <ul class="list-inline text-center">
130 |                         <li class="info-text"><a href="http://www.miibeian.gov.cn/" target="_blank">滇ICP备17011280号</a>
131 |                         </li>
132 |                         <li class="info-text">© 2018-2019 张金龙[python拓荒者]</li>
133 |                     </ul>
134 |                 </div>
135 |             </div>
136 |         </main>
137 |     </div>
138 | </div>
139 | <script src="https://cdn.bootcss.com/lazysizes/5.1.0/lazysizes.min.js"></script>
140 | <script src="{{ static_url('js/monitor.js') }}"></script>
141 | <script>
142 |     AnalogClock("clock", new AnalogClockOption(200, "#eee", "#333"));
143 | </script>
144 | <!--底部数据块-->
145 | {% block foot %}{% end %}
146 | </body>
147 | </html>
148 | 


--------------------------------------------------------------------------------
/app/templates/log.html:
--------------------------------------------------------------------------------
 1 | {% extends "layout.html" %}
 2 | 
 3 | {% block content %}
 4 | <div class="row">
 5 |     <div class="col-md-12">
 6 |         <div class="btn-group" role="group">
 7 |             <a class="btn btn-success" href="/log/?id=1">1小时内</a>
 8 |             <a class="btn btn-info" href="/log/?id=2">24小时内</a>
 9 |             <a class="btn btn-primary" href="/log/?id=3">1月内</a>
10 |         </div>
11 |         <hr>
12 |     </div>
13 |     <div class="col-md-12">
14 |         <div class="card">
15 |             <div class="card-body">
16 |                 {% raw data['line_cpu'] %}
17 |             </div>
18 |         </div>
19 |     </div>
20 |     <div class="col-md-6">
21 |         <div class="card">
22 |             <div class="card-body">
23 |                 {% raw data['line_mem'] %}
24 |             </div>
25 |         </div>
26 |     </div>
27 |     <div class="col-md-6">
28 |         <div class="card">
29 |             <div class="card-body">
30 |                 {% raw data['line_swap'] %}
31 |             </div>
32 |         </div>
33 |     </div>
34 | </div>
35 | {% end %}


--------------------------------------------------------------------------------
/app/tools/__init__.py:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thznote/monitor-python/5c5cb16ebc693734ec4df07e892ab3f60cf20c55/app/tools/__init__.py


--------------------------------------------------------------------------------
/app/tools/async_orm.py:
--------------------------------------------------------------------------------
  1 | # -*- coding: utf-8 -*-
  2 | # 进程、线程、上下文
  3 | import multiprocessing
  4 | from concurrent.futures import ThreadPoolExecutor
  5 | from contextlib import contextmanager
  6 | 
  7 | # orm相关
  8 | from sqlalchemy import create_engine, event
  9 | from sqlalchemy.engine.url import make_url
 10 | from sqlalchemy.ext.declarative import declarative_base as sa_declarative_base
 11 | from sqlalchemy.orm import sessionmaker
 12 | 
 13 | # tornado相关
 14 | from tornado.concurrent import Future, chain_future
 15 | from tornado.ioloop import IOLoop
 16 | 
 17 | __all__ = ['SessionMixin', 'set_max_workers', 'as_future',
 18 |            'make_session_factory', 'declarative_base']
 19 | 
 20 | 
 21 | class MissingFactoryError(Exception):
 22 |     pass
 23 | 
 24 | 
 25 | # 异步执行
 26 | class _AsyncExecution:
 27 |     """
 28 |     围绕线程池执行器的封装。该类不在外部实例化，但在内部我们只是将其用作包装线程池执行器，以便控制池大小并使用'as_future'作为公共方法。
 29 |     参数
 30 |     ----------
 31 |     max_workers: int
 32 |         线程池工作数量
 33 |     """
 34 | 
 35 |     def __init__(self, max_workers=None):
 36 |         self._max_workers = max_workers or multiprocessing.cpu_count()
 37 |         self._pool = None
 38 | 
 39 |     def set_max_workers(self, count):
 40 |         if self._pool:
 41 |             self._pool.shutdown(wait=True)
 42 | 
 43 |         self._max_workers = count
 44 |         self._pool = ThreadPoolExecutor(max_workers=self._max_workers)
 45 | 
 46 |     def as_future(self, query):
 47 |         """
 48 |         使SQLAlchemy查询对象异步化
 49 | 
 50 |         参数
 51 |         ----------
 52 |             query: sqlalchemy.orm.query.Query
 53 |                 要执行的sqlalchemy查询对象
 54 |         返回
 55 |         -------
 56 |             tornado.concurrent.Future
 57 |             一个获取查询记录的'Future'对象，tornado可以用await/yield调用
 58 |         """
 59 |         if not self._pool:
 60 |             self._pool = ThreadPoolExecutor(max_workers=self._max_workers)
 61 | 
 62 |         old_future = self._pool.submit(query)
 63 |         new_future = Future()
 64 | 
 65 |         IOLoop.current().add_future(old_future,
 66 |                                     lambda f: chain_future(f, new_future))
 67 | 
 68 |         return new_future
 69 | 
 70 | 
 71 | # 会话工厂
 72 | class SessionFactory:
 73 |     """
 74 |     SessionFactory是围绕sqlAlchemy提供的扩展类。这里的目的是让用户在会话级别工作而不是引擎和连接。
 75 |     参数
 76 |     ----------
 77 |         database_url: str
 78 |             数据库连接
 79 |         pool_size: int
 80 |             连接池大小
 81 |         use_native_unicode: bool
 82 |             启用/禁用本机Unicode编码；仅在以下情况下使用的驱动是psycopg2
 83 |         engine_events: List[Tuple[str, Callable]]
 84 |             订阅引擎事件的元组(name, listener_function)列表
 85 |         session_events: List[Tuple[str, Callable]]
 86 |             订阅会话事件的元组(name, listener_function)列表
 87 |     """
 88 | 
 89 |     def __init__(self, database_url, pool_size=None, use_native_unicode=True,
 90 |                  engine_events=None, session_events=None):
 91 |         self._database_url = make_url(database_url)
 92 |         self._pool_size = pool_size
 93 |         self._engine_events = engine_events
 94 |         self._session_events = session_events
 95 |         self._use_native_unicode = use_native_unicode
 96 | 
 97 |         self._engine = None
 98 |         self._factory = None
 99 | 
100 |         self._setup()
101 | 
102 |     def _setup(self):
103 |         kwargs = {}
104 | 
105 |         if self._database_url.get_driver_name() == 'postgresql':
106 |             kwargs['use_native_unicode'] = self._use_native_unicode
107 | 
108 |         if self._pool_size is not None:
109 |             kwargs['pool_size'] = self._pool_size
110 | 
111 |         self._engine = create_engine(self._database_url, **kwargs)
112 | 
113 |         if self._engine_events:
114 |             for (name, listener) in self._engine_events:
115 |                 event.listen(self._engine, name, listener)
116 | 
117 |         self._factory = sessionmaker()
118 |         self._factory.configure(bind=self._engine)
119 | 
120 |     def make_session(self):
121 |         session = self._factory()
122 | 
123 |         if self._session_events:
124 |             for (name, listener) in self._session_events:
125 |                 event.listen(session, name, listener)
126 | 
127 |         return session
128 | 
129 |     @property
130 |     def engine(self):
131 |         return self._engine
132 | 
133 | 
134 | # 会话中间件
135 | class SessionMixin:
136 |     _session = None
137 | 
138 |     # 使用上下文会话
139 |     @contextmanager
140 |     def make_session(self, session_factory):
141 |         session = None
142 | 
143 |         try:
144 |             session = self._make_session(session_factory)
145 | 
146 |             yield session
147 |         except Exception:
148 |             if session:
149 |                 session.rollback()
150 |             raise
151 |         else:
152 |             session.commit()
153 |         finally:
154 |             if session:
155 |                 session.close()
156 | 
157 |     # 关闭连接
158 |     def on_finish(self):
159 |         next_on_finish = None
160 | 
161 |         try:
162 |             next_on_finish = super(SessionMixin, self).on_finish
163 |         except AttributeError:
164 |             pass
165 | 
166 |         if self._session:
167 |             self._session.commit()
168 |             self._session.close()
169 | 
170 |         if next_on_finish:
171 |             next_on_finish()
172 | 
173 |     # 使用会话
174 |     @property
175 |     def session(self, session_factory):
176 |         if not self._session:
177 |             self._session = self._make_session(session_factory)
178 |         return self._session
179 | 
180 |     # 创建会话
181 |     def _make_session(self, session_factory):
182 |         factory = self.application.settings.get(session_factory)
183 |         if not factory:
184 |             raise MissingFactoryError()
185 | 
186 |         return factory.make_session()
187 | 
188 | 
189 | _async_exec = _AsyncExecution()
190 | 
191 | as_future = _async_exec.as_future
192 | 
193 | set_max_workers = _async_exec.set_max_workers
194 | 
195 | 
196 | # 创建会话工厂
197 | def make_session_factory(database_url,
198 |                          pool_size=None,
199 |                          use_native_unicode=True,
200 |                          engine_events=None,
201 |                          session_events=None):
202 |     return SessionFactory(database_url, pool_size, use_native_unicode,
203 |                           engine_events, session_events)
204 | 
205 | 
206 | # 创建基类
207 | class _declarative_base:
208 |     def __init__(self):
209 |         self._instance = None
210 | 
211 |     def __call__(self):
212 |         if not self._instance:
213 |             self._instance = sa_declarative_base()
214 |         return self._instance
215 | 
216 | 
217 | declarative_base = _declarative_base()
218 | 


--------------------------------------------------------------------------------
/app/tools/chart.py:
--------------------------------------------------------------------------------
  1 | # -*- coding: utf-8 -*-
  2 | import datetime
  3 | from pyecharts import options
  4 | from pyecharts.charts import Liquid, Gauge, Pie, Line
  5 | 
  6 | 
  7 | # 可视化图表类
  8 | class Chart(object):
  9 |     # 初始选项
 10 |     @property
 11 |     def init_opts(self):
 12 |         return options.InitOpts(
 13 |             width="100%",  # 画布宽度
 14 |             height="300px",  # 画布高度
 15 |         )
 16 | 
 17 |     # 标记线选项
 18 |     @property
 19 |     def markline_opts(self):
 20 |         return options.MarkLineOpts(
 21 |             data=[
 22 |                 options.MarkLineItem(type_="min"),  # 最小值
 23 |                 options.MarkLineItem(type_="average"),  # 平均值
 24 |                 options.MarkLineItem(type_="max"),  # 最大值
 25 |             ]
 26 |         )
 27 | 
 28 |     # 标记点选项
 29 |     @property
 30 |     def markpoint_opts(self):
 31 |         return options.MarkPointOpts(
 32 |             data=[
 33 |                 options.MarkPointItem(type_="min"),  # 最小值
 34 |                 options.MarkPointItem(type_="average"),  # 平均值
 35 |                 options.MarkPointItem(type_="max"),  # 最大值
 36 |             ]
 37 |         )
 38 | 
 39 |     # 标题选项
 40 |     def title_opts(self, title):
 41 |         return options.TitleOpts(
 42 |             title="{}-{}".format(
 43 |                 self.dt, title
 44 |             ),  # 标题名称
 45 |             pos_left="center",  # 标题位置
 46 |             title_textstyle_opts=options.TextStyleOpts(
 47 |                 color="white",  # 标题颜色
 48 |                 font_size=14,  # 标题大小
 49 |             )  # 标题样式
 50 |         )
 51 | 
 52 |     # 标题选项-无日期
 53 |     @staticmethod
 54 |     def title_opts_custom(title, pos_left="center", color="black", font_size=14):
 55 |         return options.TitleOpts(
 56 |             title=title,  # 标题名称
 57 |             pos_left=pos_left,  # 标题位置
 58 |             title_textstyle_opts=options.TextStyleOpts(
 59 |                 color=color,  # 标题颜色
 60 |                 font_size=font_size,  # 标题大小
 61 |             )  # 标题样式
 62 |         )
 63 | 
 64 |     # 水球图
 65 |     def liquid_html(self, chart_id, title, val):
 66 |         # 实例化
 67 |         liquid = Liquid(
 68 |             self.init_opts
 69 |         )
 70 |         # 绑定id
 71 |         liquid.chart_id = chart_id
 72 |         # 添加参数
 73 |         liquid.add("", [round(val / 100, 4)])
 74 |         # 全局参数
 75 |         liquid.set_global_opts(
 76 |             title_opts=self.title_opts(title)
 77 |         )
 78 |         # 返回图表html代码
 79 |         return liquid.render_embed()
 80 | 
 81 |     # 仪表图
 82 |     def gauge_html(self, chart_id, title, val):
 83 |         # 实例化
 84 |         gauge = Gauge(
 85 |             self.init_opts
 86 |         )
 87 |         # 绑定id
 88 |         gauge.chart_id = chart_id
 89 |         # 添加参数
 90 |         gauge.add(
 91 |             "",
 92 |             [("", val)],
 93 |             min_=0,
 94 |             max_=100
 95 |         )
 96 |         # 全局参数
 97 |         gauge.set_global_opts(
 98 |             title_opts=self.title_opts(title),  # 标题选项
 99 |             legend_opts=options.LegendOpts(is_show=False),  # 不显示图例组件
100 |         )
101 |         # 返回图表html代码
102 |         return gauge.render_embed()
103 | 
104 |     # 双饼状图
105 |     def pie_two_html(self, chart_id, title, sub_title1, sub_title2, key1, key2, val1, val2):
106 |         # 实例化饼状图
107 |         pie = Pie(
108 |             self.init_opts
109 |         )
110 |         # 绑定id
111 |         pie.chart_id = chart_id
112 |         # 绑定属性和值
113 |         pie.add(
114 |             sub_title1,
115 |             [list(v) for v in zip(key1, val1)],
116 |             center=["25%", "50%"],
117 |             radius=["30%", "75%"],
118 |             rosetype="area",
119 |             label_opts=options.LabelOpts(is_show=True)
120 |         )
121 |         pie.add(
122 |             sub_title2,
123 |             [list(v) for v in zip(key2, val2)],
124 |             center=["75%", "50%"],
125 |             radius=["30%", "75%"],
126 |             rosetype="area",
127 |             label_opts=options.LabelOpts(is_show=True)
128 |         )
129 |         # 全局参数
130 |         pie.set_global_opts(
131 |             title_opts=self.title_opts(title),  # 标题选项
132 |             legend_opts=options.LegendOpts(is_show=False),  # 不显示图例组件
133 |         )
134 |         # 返回图表html代码
135 |         return pie.render_embed()
136 | 
137 |     # 折线面积图
138 |     def line_html(self, title, key, val, color=None):
139 |         # 实例化
140 |         line = Line(
141 |             self.init_opts
142 |         )
143 |         # X轴
144 |         line.add_xaxis(key)
145 |         # Y轴
146 |         line.add_yaxis(
147 |             "",
148 |             val,
149 |             markline_opts=self.markline_opts,  # 标记线选项
150 |             markpoint_opts=self.markpoint_opts  # 标记点选项
151 |         )
152 |         # 系列配置
153 |         line.set_series_opts(
154 |             linestyle_opts=options.LineStyleOpts(
155 |                 opacity=0.2,  # 透明度
156 |             ),  # 线条样式
157 |             areastyle_opts=options.AreaStyleOpts(
158 |                 opacity=0.4,  # 透明度
159 |                 color=color  # 颜色
160 |             )  # 面积样式
161 |         )
162 |         # 全局配置
163 |         line.set_global_opts(
164 |             title_opts=self.title_opts_custom(title),  # 标题选项
165 |             datazoom_opts=[options.DataZoomOpts()],  # 缩放选项
166 |             yaxis_opts=options.AxisOpts(
167 |                 min_=0,
168 |                 max_=100
169 |             ),  # Y轴范围
170 |         )
171 |         # 返回图表html代码
172 |         return line.render_embed()
173 | 
174 |     # 最小、平均、最大基准折线图
175 |     def line_three_html(self, title, key, val_min, val_max, val_avg):
176 |         # 实例化
177 |         line = Line(
178 |             self.init_opts
179 |         )
180 |         # X轴
181 |         line.add_xaxis(key)
182 |         # Y轴
183 |         line.add_yaxis(
184 |             "最小值",
185 |             val_min,
186 |             is_smooth=True,  # 平滑曲线
187 |             markpoint_opts=self.markpoint_opts  # 标记点选项
188 |         )
189 |         line.add_yaxis(
190 |             "最大值",
191 |             val_max,
192 |             is_smooth=True,  # 平滑曲线
193 |             markpoint_opts=self.markpoint_opts  # 标记点选项
194 |         )
195 |         line.add_yaxis(
196 |             "平均值",
197 |             val_avg,
198 |             is_smooth=True,  # 平滑曲线
199 |             markpoint_opts=self.markpoint_opts  # 标记点选项
200 |         )
201 |         # 全局配置
202 |         line.set_global_opts(
203 |             title_opts=self.title_opts_custom(title, pos_left="left"),  # 标题选项
204 |             datazoom_opts=[options.DataZoomOpts()],  # 缩放选项
205 |             yaxis_opts=options.AxisOpts(
206 |                 min_=0,
207 |                 max_=100
208 |             ),  # Y轴范围
209 |         )
210 |         # 返回图表html代码
211 |         return line.render_embed()
212 | 
213 |     # 日期时间方法
214 |     @property
215 |     def dt(self):
216 |         return datetime.datetime.now().strftime("%Y-%m-%d %H:%M:%S")
217 | 


--------------------------------------------------------------------------------
/app/tools/monitor.py:
--------------------------------------------------------------------------------
  1 | # -*- coding: utf-8 -*-
  2 | # 导入日期时间库
  3 | import datetime
  4 | # 导入系统信息库
  5 | import psutil
  6 | 
  7 | 
  8 | # 定义一个专门用于获取系统信息的类
  9 | class Monitor(object):
 10 |     # 专门用于单位转化的方法
 11 |     @staticmethod
 12 |     def bytes_to_gb(data, key=""):
 13 |         if key == "percent":
 14 |             # 百分比直接返回
 15 |             return data
 16 |         else:
 17 |             # 字节转化为GB，保留两位小数
 18 |             return round(data / (1024 ** 3), 2)
 19 | 
 20 |     # 专门获取CPU信息
 21 |     @staticmethod
 22 |     def cpu():
 23 |         # percpu：True获取每个CPU的使用率，False获取平均使用率
 24 |         data = dict(
 25 |             percent_avg=psutil.cpu_percent(interval=0, percpu=False),  # 平均使用率
 26 |             percent_per=psutil.cpu_percent(interval=0, percpu=True),  # 单独使用率
 27 |             num_p=psutil.cpu_count(logical=False),  # 物理CPU核心数
 28 |             num_l=psutil.cpu_count(logical=True)  # 逻辑CPU核心数
 29 |         )
 30 |         return data
 31 | 
 32 |     # 专门获取内存信息
 33 |     def mem(self):
 34 |         # 内存信息
 35 |         info = psutil.virtual_memory()
 36 |         data = dict(
 37 |             total=self.bytes_to_gb(info.total),  # 内存总量
 38 |             used=self.bytes_to_gb(info.used),  # 内存使用量
 39 |             free=self.bytes_to_gb(info.free),  # 内存剩余量
 40 |             percent=info.percent  # 内存使用率
 41 |         )
 42 |         return data
 43 | 
 44 |     # 专门获取交换分区/文件信息
 45 |     def swap(self):
 46 |         # 交换文件/分区信息
 47 |         info = psutil.swap_memory()
 48 |         data = dict(
 49 |             total=self.bytes_to_gb(info.total),  # 交换分区总量
 50 |             free=self.bytes_to_gb(info.free),  # 交换分区剩余量
 51 |             used=self.bytes_to_gb(info.used),  # 交换分区使用量
 52 |             percent=info.percent  # 交换分区使用率
 53 |         )
 54 |         return data
 55 | 
 56 |     # 专门获取磁盘信息
 57 |     def disk(self):
 58 |         # 专门获取磁盘分区信息
 59 |         info = psutil.disk_partitions()
 60 |         # 列表推导式
 61 |         data = [
 62 |             dict(
 63 |                 device=v.device,  # 设备名称
 64 |                 mountpoint=v.mountpoint,  # 挂载点
 65 |                 fstype=v.fstype,  # 文件系统类型
 66 |                 opts=v.opts,  # 操作选项
 67 |                 used={
 68 |                     key: self.bytes_to_gb(val, key)
 69 |                     for key, val in psutil.disk_usage(v.mountpoint)._asdict().items()
 70 |                 }  # 使用情况
 71 |             )
 72 |             for v in info if 'rw' in v.opts
 73 |         ]
 74 |         # if v.opts == 'rw,fixed'  # 获取可读可写的固定磁盘
 75 |         return data
 76 | 
 77 |     # 专门获取网络信息
 78 |     @staticmethod
 79 |     def net():
 80 |         # 获取地址信息
 81 |         address = psutil.net_if_addrs()
 82 |         # 处理地址信息
 83 |         address_info = {
 84 |             k: [
 85 |                 dict(
 86 |                     family=val.family.name,  # 协议地址族名称
 87 |                     address=val.address,  # IP地址
 88 |                     netmask=val.netmask,  # 子网掩码
 89 |                     broadcast=val.broadcast  # 广播地址
 90 |                 )
 91 |                 for val in v if val.family.name == "AF_INET"  # 过滤IPV4协议
 92 |             ]
 93 |             for k, v in address.items()
 94 |         }
 95 |         # 获取网络信息
 96 |         io = psutil.net_io_counters(pernic=True)
 97 |         # 处理网络信息
 98 |         data = [
 99 |             dict(
100 |                 name=k,  # 网卡名称
101 |                 bytes_sent=v.bytes_sent,  # 发送字节数
102 |                 bytes_recv=v.bytes_recv,  # 接收字节数
103 |                 packets_sent=v.packets_sent,  # 发送包数
104 |                 packets_recv=v.packets_recv,  # 接收包数
105 |                 **address_info[k][0]
106 |             )
107 |             for k, v in io.items() if len(address_info[k]) > 0
108 |         ]
109 |         return data
110 | 
111 |     # 时间戳转化为时间字符方法
112 |     @staticmethod
113 |     def td(tm):
114 |         dt = datetime.datetime.fromtimestamp(tm)
115 |         return dt.strftime("%Y-%m-%d %H:%M:%S")
116 | 
117 |     # 获取日期时间
118 |     @staticmethod
119 |     def dt():
120 |         return datetime.datetime.now().strftime("%Y-%m-%d %H:%M:%S")
121 | 
122 |     # 专门获取最近开机时间
123 |     def lasted_start_time(self):
124 |         # 时间戳
125 |         return self.td(psutil.boot_time())
126 | 
127 |     # 专门获取系统登录用户
128 |     def login_users(self):
129 |         # 获取系统登录用户
130 |         users = psutil.users()
131 |         # 处理系统登录用户
132 |         data = [
133 |             dict(
134 |                 name=v.name,  # 登录用户
135 |                 terminal=v.terminal,  # 登录终端
136 |                 host=v.host,  # 登录主机
137 |                 started=self.td(v.started),  # 登录时间
138 |                 pid=v.pid  # 进程ID
139 |             )
140 |             for v in users
141 |         ]
142 |         return data
143 | 


--------------------------------------------------------------------------------
/app/tools/sync_orm.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | import mysql.connector  # 数据库连接驱动
 3 | from sqlalchemy import create_engine  # 创建引擎
 4 | from sqlalchemy.orm import sessionmaker  # 创建会话
 5 | from app.configs import mysql_configs  # 数据库配置
 6 | 
 7 | 
 8 | class ORM:
 9 |     # 会话方法
10 |     @classmethod
11 |     def db(cls):
12 |         link = "mysql+mysqlconnector://{db_user}:{db_pwd}@{db_host}:{db_port}/{db_name}?charset=utf8".format(
13 |             **mysql_configs
14 |         )
15 |         # 创建引擎
16 |         engine = create_engine(
17 |             link,
18 |             encoding="utf-8",
19 |             echo=False,
20 |             pool_size=100,
21 |             pool_recycle=10,
22 |             connect_args={'charset': 'utf8'}
23 |         )
24 |         # 创建会话
25 |         session = sessionmaker(
26 |             bind=engine,
27 |             autocommit=False,
28 |             autoflush=True,
29 |             expire_on_commit=False
30 |         )
31 |         return session()
32 | 


--------------------------------------------------------------------------------
/app/urls.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | # 导入系统监控视图
 3 | from app.views.views_index import IndexHandler
 4 | # 导入日志监控视图
 5 | from app.views.views_log import LogHandler
 6 | # 导入实时监控视图
 7 | from app.views.views_real_time import RealTimeHandler
 8 | 
 9 | # 配置路由视图映射规则
10 | urls = [
11 |     (r"/", IndexHandler),
12 |     (r"/log/", LogHandler),
13 |     (r"/real/time/", RealTimeHandler),
14 | ]
15 | 


--------------------------------------------------------------------------------
/app/views/__init__.py:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/thznote/monitor-python/5c5cb16ebc693734ec4df07e892ab3f60cf20c55/app/views/__init__.py


--------------------------------------------------------------------------------
/app/views/views_common.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | import tornado.web
 3 | from app.tools.monitor import Monitor
 4 | from app.tools.async_orm import SessionMixin
 5 | 
 6 | 
 7 | # 公共视图
 8 | class CommonHandler(tornado.web.RequestHandler, SessionMixin):
 9 |     @staticmethod
10 |     def progress_status(val):
11 |         data = ""
12 |         if 0 <= val < 25:
13 |             data = " bg-success"  # 绿色
14 |         if 25 <= val < 50:
15 |             data = ""
16 |         if 50 <= val < 75:
17 |             data = " bg-warning"  # 橙色
18 |         if 75 <= val <= 100:
19 |             data = " bg-danger"  # 红色
20 |         return data
21 | 
22 |     # 最近开始时间
23 |     @property
24 |     def started(self):
25 |         m = Monitor()
26 |         return m.lasted_start_time()
27 | 
28 |     # 最近登录用户
29 |     @property
30 |     def users(self):
31 |         m = Monitor()
32 |         return m.login_users()
33 | 


--------------------------------------------------------------------------------
/app/views/views_index.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | from app.views.views_common import CommonHandler
 3 | from app.tools.monitor import Monitor
 4 | from app.tools.chart import Chart
 5 | 
 6 | 
 7 | # 定义一个首页视图
 8 | class IndexHandler(CommonHandler):
 9 |     async def get(self):
10 |         # 实例化系统信息类
11 |         monitor = Monitor()
12 |         # 实例化可视化图表类
13 |         chart = Chart()
14 |         # CPU信息
15 |         cpu_info = monitor.cpu()
16 |         # 内存信息
17 |         mem_info = monitor.mem()
18 |         # 交换分区
19 |         swap_info = monitor.swap()
20 |         # 网络信息
21 |         net_info = monitor.net()
22 |         # 磁盘信息
23 |         disk_info = monitor.disk()
24 |         # 网络信息
25 |         net_pie = [
26 |             chart.pie_two_html(
27 |                 "net{}".format(k + 1),
28 |                 "{}网卡信息".format(v["name"]),
29 |                 "收发包数统计",
30 |                 "收发字节统计",
31 |                 ["收包数", "发包数"],
32 |                 ["收字节", "发字节"],
33 |                 [v["packets_recv"], v["packets_sent"]],
34 |                 [v["bytes_recv"], v["bytes_sent"]],
35 |             )
36 |             for k, v in enumerate(net_info) if v["packets_recv"] and v['packets_sent']
37 |         ]
38 |         # 渲染视图
39 |         self.render(
40 |             "index.html",
41 |             data=dict(
42 |                 title="系统监控",
43 |                 cpu_info=cpu_info,
44 |                 mem_info=mem_info,
45 |                 swap_info=swap_info,
46 |                 net_info=net_info,
47 |                 disk_info=disk_info,
48 |                 cpu_liquid=chart.liquid_html("cpu_avg", "CPU平均使用率", cpu_info['percent_avg']),
49 |                 mem_gauge=chart.gauge_html("mem", "内存使用率", mem_info['percent']),
50 |                 swap_gauge=chart.gauge_html("swap", "交换分区使用率", mem_info['percent']),
51 |                 net_pie=net_pie,
52 |             )
53 |         )
54 | 


--------------------------------------------------------------------------------
/app/views/views_log.py:
--------------------------------------------------------------------------------
  1 | # -*- coding: utf-8 -*-
  2 | import datetime
  3 | from app.views.views_common import CommonHandler
  4 | from sqlalchemy import and_, func  # 并列条件连接符
  5 | from app.models.models import Mem, Swap, Cpu  # 导入硬件信息模型
  6 | from app.tools.chart import Chart
  7 | from app.tools.async_orm import as_future
  8 | 
  9 | 
 10 | class LogHandler(CommonHandler):
 11 |     async def get(self):
 12 |         # 用_id参数来标识
 13 |         _id = self.get_argument("id", "1")
 14 |         data = dict(title="日志统计")
 15 |         chart = Chart()
 16 |         # _id = 1表示1小时内
 17 |         if int(_id) == 1:
 18 |             attr_cpu, attr_mem, attr_swap, values_cpu, values_mem, values_swap = await self.data_by_hour()
 19 |             # 内存折线面积图
 20 |             if attr_mem and values_mem:
 21 |                 data["line_mem"] = chart.line_html(
 22 |                     "内存使用率日志[1小时内]",
 23 |                     attr_mem,
 24 |                     values_mem,
 25 |                     "red"
 26 |                 )
 27 |             else:
 28 |                 data["line_mem"] = "<div class='alert alert-danger'>没有内存[1小时内]数据</div>"
 29 | 
 30 |             # 交换分区折线面积图
 31 |             if attr_swap and values_swap:
 32 |                 data["line_swap"] = chart.line_html(
 33 |                     "交换分区使用率日志[1小时内]",
 34 |                     attr_swap,
 35 |                     values_swap,
 36 |                     "blue"
 37 |                 )
 38 |             else:
 39 |                 data["line_swap"] = "<div class='alert alert-danger'>没有交换分区[1小时内]数据</div>"
 40 | 
 41 |             # CPU折线面积图
 42 |             if attr_cpu and values_cpu:
 43 |                 data["line_cpu"] = chart.line_html(
 44 |                     "CPU使用率日志[1小时内]",
 45 |                     attr_cpu,
 46 |                     values_cpu,
 47 |                     "green"
 48 |                 )
 49 |             else:
 50 |                 data["line_cpu"] = "<div class='alert alert-danger'>没有CPU[1小时内]数据</div>"
 51 | 
 52 |         # _id = 2表示1天内
 53 |         if int(_id) == 2:
 54 |             attr_mem, values_mem_min, values_mem_max, values_mem_avg, attr_swap, values_swap_min, values_swap_max, values_swap_avg, attr_cpu, values_cpu_min, values_cpu_max, values_cpu_avg = await self.data_by_three()
 55 |             if attr_mem and values_mem_min and values_mem_max and values_mem_avg:
 56 |                 data['line_mem'] = chart.line_three_html(
 57 |                     "内存使用率日志[今天]",
 58 |                     attr_mem,
 59 |                     values_mem_min,
 60 |                     values_mem_max,
 61 |                     values_mem_avg
 62 |                 )
 63 |             else:
 64 |                 data["line_mem"] = "<div class='alert alert-danger'>没有内存[今天]数据</div>"
 65 |             if attr_swap and values_swap_min and values_swap_max and values_swap_avg:
 66 |                 data['line_swap'] = chart.line_three_html(
 67 |                     "交换分区使用率日志[今天]",
 68 |                     attr_swap,
 69 |                     values_swap_min,
 70 |                     values_swap_max,
 71 |                     values_swap_avg
 72 |                 )
 73 |             else:
 74 |                 data["line_swap"] = "<div class='alert alert-danger'>没有交换分区[今天]数据</div>"
 75 |             if attr_cpu and values_cpu_min and values_cpu_max and values_cpu_avg:
 76 |                 data['line_cpu'] = chart.line_three_html(
 77 |                     "CPU使用率日志[今天]",
 78 |                     attr_cpu,
 79 |                     values_cpu_min,
 80 |                     values_cpu_max,
 81 |                     values_cpu_avg
 82 |                 )
 83 |             else:
 84 |                 data["line_cpu"] = "<div class='alert alert-danger'>没有CPU[今天]数据</div>"
 85 |         # _id = 3表示1个月内
 86 |         if int(_id) == 3:
 87 |             attr_mem, values_mem_min, values_mem_max, values_mem_avg, attr_swap, values_swap_min, values_swap_max, values_swap_avg, attr_cpu, values_cpu_min, values_cpu_max, values_cpu_avg = await self.data_by_three(
 88 |                 method="month",
 89 |                 _format="%Y%m%d"
 90 |             )
 91 |             if attr_mem and values_mem_min and values_mem_max and values_mem_avg:
 92 |                 data['line_mem'] = chart.line_three_html(
 93 |                     "内存使用率日志[本月]",
 94 |                     attr_mem,
 95 |                     values_mem_min,
 96 |                     values_mem_max,
 97 |                     values_mem_avg
 98 |                 )
 99 |             else:
100 |                 data["line_mem"] = "<div class='alert alert-danger'>没有内存[本月]数据</div>"
101 |             if attr_swap and values_swap_min and values_swap_max and values_swap_avg:
102 |                 data['line_swap'] = chart.line_three_html(
103 |                     "交换分区使用率日志[本月]",
104 |                     attr_swap,
105 |                     values_swap_min,
106 |                     values_swap_max,
107 |                     values_swap_avg
108 |                 )
109 |             else:
110 |                 data["line_swap"] = "<div class='alert alert-danger'>没有交换分区[本月]数据</div>"
111 |             if attr_cpu and values_cpu_min and values_cpu_max and values_cpu_avg:
112 |                 data['line_cpu'] = chart.line_three_html(
113 |                     "CPU使用率日志[本月]",
114 |                     attr_cpu,
115 |                     values_cpu_min,
116 |                     values_cpu_max,
117 |                     values_cpu_avg
118 |                 )
119 |             else:
120 |                 data["line_cpu"] = "<div class='alert alert-danger'>没有CPU[本月]数据</div>"
121 |         self.render("log.html", data=data)
122 | 
123 |     # 一小时内数据查询方法
124 |     async def data_by_hour(self):
125 |         now_time, next_time = self.dt_range()
126 |         attr_cpu, attr_mem, attr_swap = None, None, None  # 属性
127 |         values_cpu, values_mem, values_swap = None, None, None  # 值
128 |         with self.make_session("local") as session:
129 |             # 内存
130 |             mem = await self.one_hour_query(Mem, session, now_time, next_time)
131 |             if mem:
132 |                 attr_mem = [v.create_time.strftime("%H:%M:%S") for v in mem]
133 |                 values_mem = [float(v.percent) for v in mem]
134 | 
135 |             # 交换分区
136 |             swap = await self.one_hour_query(Swap, session, now_time, next_time)
137 |             if swap:
138 |                 attr_swap = [v.create_time.strftime("%H:%M:%S") for v in swap]
139 |                 values_swap = [float(v.percent) for v in swap]
140 | 
141 |             # CPU
142 |             cpu = await self.one_hour_query(Cpu, session, now_time, next_time)
143 |             if cpu:
144 |                 attr_cpu = [v.create_time.strftime("%H:%M:%S") for v in cpu]
145 |                 values_cpu = [float(v.percent) for v in cpu]
146 | 
147 |         return attr_cpu, attr_mem, attr_swap, values_cpu, values_mem, values_swap
148 | 
149 |     # 一小时查询方法
150 |     @staticmethod
151 |     async def one_hour_query(model, session, now_time, next_time):
152 |         """
153 |         model：模型（Cpu、Mem、Swap）
154 |         order_by：排序（按时间升序排序）
155 |         filter：过滤条件（时间大于等于当前时间0分0秒，小于下1个小时的0分0秒）
156 |         """
157 |         data = await as_future(
158 |             session.query(model).order_by(model.create_dt.asc()).filter(
159 |                 and_(
160 |                     model.create_dt >= now_time.strftime("%Y-%m-%d %H") + ":00:00",
161 |                     model.create_dt < next_time.strftime("%Y-%m-%d %H") + ":00:00",
162 |                 )
163 |             ).all
164 |         )
165 |         return data
166 | 
167 |     # 查询三种曲线数据
168 |     async def data_by_three(self, method="day", _format="%Y%m%d%H"):
169 |         attr_mem, values_mem_min, values_mem_max, values_mem_avg = None, None, None, None
170 |         attr_swap, values_swap_min, values_swap_max, values_swap_avg = None, None, None, None
171 |         attr_cpu, values_cpu_min, values_cpu_max, values_cpu_avg = None, None, None, None
172 |         with self.make_session("local") as session:
173 |             # 内存
174 |             mem = await self.three_query(Mem, session, method, _format)
175 |             if mem:
176 |                 attr_mem = [v[0] for v in mem]
177 |                 values_mem_min = [float(v[1]) for v in mem]
178 |                 values_mem_max = [float(v[2]) for v in mem]
179 |                 values_mem_avg = [round(float(v[3]), 1) for v in mem]
180 |             # 交换分区
181 |             swap = await self.three_query(Swap, session, method, _format)
182 |             if swap:
183 |                 attr_swap = [v[0] for v in swap]
184 |                 values_swap_min = [float(v[1]) for v in swap]
185 |                 values_swap_max = [float(v[2]) for v in swap]
186 |                 values_swap_avg = [round(float(v[3]), 1) for v in swap]
187 |             # CPU
188 |             cpu = await self.three_query(Cpu, session, method, _format)
189 |             if cpu:
190 |                 attr_cpu = [v[0] for v in cpu]
191 |                 values_cpu_min = [float(v[1]) for v in cpu]
192 |                 values_cpu_max = [float(v[2]) for v in cpu]
193 |                 values_cpu_avg = [round(float(v[3]), 1) for v in cpu]
194 | 
195 |         return attr_mem, values_mem_min, values_mem_max, values_mem_avg, \
196 |                attr_swap, values_swap_min, values_swap_max, values_swap_avg, \
197 |                attr_cpu, values_cpu_min, values_cpu_max, values_cpu_avg
198 | 
199 |     # 查询最大值，最小值，平均值方法
200 |     @staticmethod
201 |     async def three_query(model, session, method="day", _format="%Y%m%d%H"):
202 |         """
203 |         func.date_format(model.create_dt, format)转化日期格式，把第1个参数转化为format格式
204 |         """
205 |         model_query = session.query(
206 |             func.date_format(model.create_dt, _format),
207 |             func.min(model.percent),
208 |             func.max(model.percent),
209 |             func.avg(model.percent)
210 |         )
211 |         data = None
212 |         if method == "day":
213 |             # 过滤出今天的数据
214 |             # 按照小时分组
215 |             # 按照时间升序排序
216 |             data = await as_future(
217 |                 model_query.filter(
218 |                     func.to_days(model.create_dt) == func.to_days(func.now())
219 |                 ).group_by(
220 |                     func.date_format(model.create_dt, _format)
221 |                 ).order_by(model.create_dt.asc()).all
222 |             )
223 |         if method == "month":
224 |             # 过滤出当前月的数据
225 |             # 按照天来分组
226 |             # 按照时间升序排序
227 |             data = await as_future(
228 |                 model_query.filter(
229 |                     func.date_format(model.create_dt, "%Y%m") == func.date_format(func.curdate(), "%Y%m")
230 |                 ).group_by(
231 |                     model.create_date
232 |                 ).order_by(model.create_dt.asc()).all
233 |             )
234 |         return data
235 | 
236 |     # 时间范围方法
237 |     @staticmethod
238 |     def dt_range():
239 |         now_time = datetime.datetime.now()  # 当前小时的时间
240 |         next_time = now_time + datetime.timedelta(hours=1)  # 下一个小时时间
241 |         return now_time, next_time
242 | 


--------------------------------------------------------------------------------
/app/views/views_real_time.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | import json
 3 | import tornado.websocket
 4 | from app.tools.monitor import Monitor
 5 | 
 6 | 
 7 | # 实时监控类
 8 | class RealTimeHandler(tornado.websocket.WebSocketHandler):
 9 |     # 定义连接池
10 |     waiters = set()
11 | 
12 |     def get_compression_options(self):
13 |         return {}
14 | 
15 |     # 1.建立连接
16 |     def open(self):
17 |         RealTimeHandler.waiters.add(self)
18 | 
19 |     # 2.关闭连接
20 |     def on_close(self):
21 |         RealTimeHandler.waiters.remove(self)
22 | 
23 |     # 发送修改
24 |     @classmethod
25 |     def send_updates(cls, chat):
26 |         for waiter in cls.waiters:
27 |             try:
28 |                 waiter.write_message(chat)
29 |             except Exception as e:
30 |                 print(e)
31 | 
32 |     # 3.发送消息
33 |     def on_message(self, message):
34 |         try:
35 |             m = Monitor()
36 |             data = dict()
37 |             if message == "system":
38 |                 data = dict(
39 |                     mem=m.mem(),
40 |                     swap=m.swap(),
41 |                     cpu=m.cpu(),
42 |                     disk=m.disk(),
43 |                     net=m.net(),
44 |                     dt=m.dt()
45 |                 )
46 |             RealTimeHandler.send_updates(json.dumps(data))
47 |         except Exception as e:
48 |             print(e)
49 | 


--------------------------------------------------------------------------------
/log.py:
--------------------------------------------------------------------------------
 1 | # -*- coding: utf-8 -*-
 2 | import time
 3 | import datetime
 4 | from app.models.models import Cpu, Mem, Swap
 5 | from app.tools.monitor import Monitor
 6 | from app.tools.sync_orm import ORM
 7 | 
 8 | 
 9 | # 日期时间函数
10 | def dt():
11 |     now_date_time = datetime.datetime.now()  # 日期时间
12 |     now_date = now_date_time.date()  # 日期
13 |     now_time = now_date_time.time()  # 时间
14 |     return now_date, now_time, now_date_time
15 | 
16 | 
17 | # 定义保存日志的函数
18 | def save_log():
19 |     m = Monitor()
20 |     cpu_info, mem_info, swap_info = m.cpu(), m.mem(), m.swap()
21 |     now_date, now_time, now_date_time = dt()
22 |     # 1.创建会话
23 |     session = ORM.db()
24 |     try:
25 |         # CPU
26 |         cpu = Cpu(
27 |             percent=cpu_info["percent_avg"],
28 |             create_date=now_date,
29 |             create_time=now_time,
30 |             create_dt=now_date_time
31 |         )
32 |         # 内存
33 |         mem = Mem(
34 |             percent=mem_info['percent'],
35 |             total=mem_info['total'],
36 |             used=mem_info['used'],
37 |             free=mem_info['free'],
38 |             create_date=now_date,
39 |             create_time=now_time,
40 |             create_dt=now_date_time
41 |         )
42 |         # 交换分区
43 |         swap = Swap(
44 |             percent=swap_info['percent'],
45 |             total=swap_info['total'],
46 |             used=swap_info['used'],
47 |             free=swap_info['free'],
48 |             create_date=now_date,
49 |             create_time=now_time,
50 |             create_dt=now_date_time
51 |         )
52 |         # 提交数据
53 |         session.add(cpu)
54 |         session.add(mem)
55 |         session.add(swap)
56 |     except Exception as e:
57 |         print(e)
58 |         # 异常回滚
59 |         session.rollback()
60 |     else:
61 |         # 正常提交
62 |         session.commit()
63 |     finally:
64 |         # 关闭会话
65 |         session.close()
66 | 
67 | 
68 | if __name__ == "__main__":
69 |     while True:
70 |         # now_date, now_time, now_date_time = dt()
71 |         # print("开始时间：{}".format(now_date_time))
72 |         save_log()
73 |         # print("结束时间：{}".format(now_date_time))
74 |         time.sleep(5)  # 每隔5秒采集一次
75 | 


--------------------------------------------------------------------------------
/manage.py:
--------------------------------------------------------------------------------
1 | # -*- coding: utf-8 -*-
2 | from app import create_server
3 | 
4 | # 主执行程序
5 | if __name__ == "__main__":
6 |     # 创建服务
7 |     create_server()
8 | 


--------------------------------------------------------------------------------
/nginx.conf:
--------------------------------------------------------------------------------
 1 | worker_processes 1;
 2 | 
 3 | events {
 4 |     use epoll;
 5 |     worker_connections 65535;
 6 | }
 7 | 
 8 | http {
 9 |     include mime.types;
10 |     default_type application/octet-stream;
11 |     sendfile on;
12 |     server_tokens off;
13 |     keepalive_timeout 10;
14 |     tcp_nodelay on;
15 |     gzip on;
16 |     gzip_min_length 1k;
17 |     gzip_comp_level 9;
18 |     gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png font/ttf font/otf image/svg+xml;
19 |     gzip_vary on;
20 |     gzip_disable "MSIE [1-6]\.";
21 |     client_max_body_size 100m;
22 | 
23 |     upstream monitor {
24 |         server 127.0.0.1:8000;
25 |     }
26 |     server {
27 |         listen 80;
28 |         server_name monitor.wmai.xyz monitor.thznote.com;
29 |         location / {
30 |             proxy_pass_header Server;
31 |             proxy_set_header Host $http_host;
32 |             proxy_redirect off;
33 |             proxy_set_header X-Real-IP $remote_addr;
34 |             proxy_set_header X-Scheme $scheme;
35 |             proxy_http_version 1.1;
36 |             proxy_set_header Upgrade $http_upgrade;
37 |             proxy_set_header Connection "Upgrade";
38 |             proxy_pass http://monitor;
39 |         }
40 |     }
41 | }
42 | 
43 | 


--------------------------------------------------------------------------------
/requirements.txt:
--------------------------------------------------------------------------------
1 | tornado==6.0.2
2 | mysql-connector-python==8.0.16
3 | sqlalchemy==1.3.3
4 | psutil==5.6.2
5 | pyecharts==1.1.0
6 | pyecharts-snapshot==0.2.0
7 | 


--------------------------------------------------------------------------------
/supervisord.conf:
--------------------------------------------------------------------------------
 1 | [program:monitor]
 2 | command = /usr/bin/python3 /usr/local/nginx/html/monitor_python/manage.py
 3 | autostart = true
 4 | autorestart = true
 5 | stdout_logfile=/usr/local/nginx/html/monitor_python/err.log
 6 | 
 7 | [program:monitor-log]
 8 | command = /usr/bin/python3 /usr/local/nginx/html/monitor_python/log.py
 9 | autostart = true
10 | autorestart = true
11 | stdout_logfile=/usr/local/nginx/html/monitor_python/err-log.log
12 | 


--------------------------------------------------------------------------------