├── .browserslistrc ├── .eslintrc.js ├── .gitignore ├── .npmignore ├── LICENSE ├── README.md ├── README_CN.md ├── babel.config.js ├── dist ├── TreeChart.common.js ├── TreeChart.common.js.map ├── TreeChart.umd.js ├── TreeChart.umd.js.map ├── TreeChart.umd.min.js ├── TreeChart.umd.min.js.map └── demo.html ├── docs ├── favicon.ico ├── index.html └── js │ ├── app.4c2dc105.js │ ├── app.4c2dc105.js.map │ ├── chunk-vendors.6f390d76.js │ └── chunk-vendors.6f390d76.js.map ├── package.json ├── public ├── favicon.ico └── index.html ├── src ├── App.vue ├── assets │ └── logo.png ├── components │ └── TreeChart.vue └── main.js └── vue.config.js /.browserslistrc: -------------------------------------------------------------------------------- 1 | ie 11 -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | env: { 4 | node: true 5 | }, 6 | 'extends': [ 7 | 'plugin:vue/essential', 8 | 'eslint:recommended' 9 | ], 10 | parserOptions: { 11 | parser: 'babel-eslint' 12 | }, 13 | rules: { 14 | 'no-console': 'off', 15 | 'no-debugger': 'off', 16 | 'no-unreachable': 'warn', 17 | 'no-unused-vars': 'warn', 18 | 'vue/no-async-in-computed-properties': 'warn', 19 | 'vue/no-dupe-keys': 'warn', 20 | 'vue/no-duplicate-attributes': 'warn', 21 | 'vue/no-parsing-error': 'warn', 22 | 'vue/no-reserved-keys': 'warn', 23 | 'vue/no-shared-component-data': 'warn', 24 | 'vue/no-side-effects-in-computed-properties': 'warn', 25 | 'vue/no-template-key': 'warn', 26 | 'vue/no-textarea-mustache': 'warn', 27 | 'vue/no-unused-components': 'warn', 28 | 'vue/no-unused-vars': 'warn', 29 | 'vue/no-use-v-if-with-v-for': 'warn', 30 | 'vue/require-component-is': 'warn', 31 | 'vue/require-prop-type-constructor': 'warn', 32 | 'vue/require-render-return': 'warn', 33 | 'vue/require-v-for-key': 'warn', 34 | 'vue/require-valid-default-prop': 'warn', 35 | 'vue/return-in-computed-property': 'warn', 36 | 'vue/use-v-on-exact': 'warn', 37 | 'vue/valid-template-root': 'warn', 38 | 'vue/valid-v-bind': 'warn', 39 | 'vue/valid-v-cloak': 'warn', 40 | 'vue/valid-v-else-if': 'warn', 41 | 'vue/valid-v-else': 'warn', 42 | 'vue/valid-v-for': 'warn', 43 | 'vue/valid-v-html': 'warn', 44 | 'vue/valid-v-if': 'warn', 45 | 'vue/valid-v-model': 'warn', 46 | 'vue/valid-v-on': 'warn', 47 | 'vue/valid-v-once': 'warn', 48 | 'vue/valid-v-pre': 'warn', 49 | 'vue/valid-v-show': 'warn', 50 | 'vue/valid-v-text': 'warn' 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | 4 | # local env files 5 | .env.local 6 | .env.*.local 7 | 8 | # Log files 9 | npm-debug.log* 10 | yarn-debug.log* 11 | yarn-error.log* 12 | 13 | # Editor directories and files 14 | .idea 15 | .vscode 16 | *.suo 17 | *.ntvs* 18 | *.njsproj 19 | *.sln 20 | *.sw* 21 | /package-lock.json 22 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | /public 2 | /src 3 | /docs 4 | /lib -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 refined-x 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 | English | [中文](README_CN.md) 2 | 3 | # vue-tree-chart 4 | 5 | [![npm](https://img.shields.io/npm/v/vue-tree-chart.svg)](https://www.npmjs.com/package/vue-tree-chart/) [![license](https://img.shields.io/github/license/tower1229/Vue-Tree-Chart.svg)]() 6 | 7 | > :deciduous_tree: A Vue component to display tree chart 8 | 9 | ![logo](https://refined-x.com/asset/vtc-logo.png) 10 | 11 | Vue3.x version [is here](https://github.com/tower1229/Vue-Tree-Chart/tree/vue3) 12 | 13 | ## Install 14 | 15 | ```bash 16 | npm i vue-tree-chart --save 17 | ``` 18 | 19 | ## Usage 20 | 21 | in template: 22 | 23 | ```html 24 | 25 | ``` 26 | 27 | in script: 28 | 29 | ```js 30 | import TreeChart from "vue-tree-chart"; 31 | 32 | export default { 33 | components: { 34 | TreeChart 35 | }, 36 | data() { 37 | return { 38 | treeData: { 39 | ... 40 | } 41 | } 42 | } 43 | ... 44 | ``` 45 | 46 | ## Prop 47 | 48 | ### json 49 | 50 | Component data to support those field： 51 | 52 | ```text 53 | - name[String] to display a node name 54 | - image_url[String] to display a node image 55 | - children[Array] node`s children 56 | - mate[Array] node`s mate 57 | - class[Array] node`s class 58 | - extend[Boolean] show/hide node`s children, default True 59 | ``` 60 | 61 | Example： 62 | 63 | ```js 64 | { 65 | name: 'root', 66 | image_url: "https://static.refined-x.com/avat.jpg", 67 | class: ["rootNode"], 68 | children: [ 69 | { 70 | name: 'children1', 71 | image_url: "https://static.refined-x.com/avat1.jpg" 72 | }, 73 | { 74 | name: 'children2', 75 | image_url: "https://static.refined-x.com/avat2.jpg", 76 | mate: [{ 77 | name: 'mate', 78 | image_url: "https://static.refined-x.com/avat3.jpg" 79 | }], 80 | children: [ 81 | { 82 | name: 'grandchild', 83 | image_url: "https://static.refined-x.com/avat.jpg" 84 | }, 85 | { 86 | name: 'grandchild2', 87 | image_url: "https://static.refined-x.com/avat1.jpg" 88 | }, 89 | { 90 | name: 'grandchild3', 91 | image_url: "https://static.refined-x.com/avat2.jpg" 92 | } 93 | ] 94 | }, 95 | { 96 | name: 'children3', 97 | image_url: "https://static.refined-x.com/avat.jpg" 98 | } 99 | ] 100 | } 101 | ``` 102 | 103 | ## Event 104 | 105 | ### click-node(node) 106 | 107 | Click on the node triggered, receive the current node data as a parameter 108 | 109 | ## Run a demo 110 | 111 | ```bash 112 | npm run serve 113 | ``` 114 | 115 | ## Build 116 | 117 | ```bash 118 | npm run build-bundle 119 | ``` 120 | 121 | Copyright (c) 2017-present, [前端路上](http://refined-x.com) 122 | -------------------------------------------------------------------------------- /README_CN.md: -------------------------------------------------------------------------------- 1 | 中文 | [English](README.md) 2 | 3 | # vue-tree-chart 4 | 5 | [![npm](https://img.shields.io/npm/v/vue-tree-chart.svg)](https://www.npmjs.com/package/vue-tree-chart/) [![license](https://img.shields.io/github/license/tower1229/Vue-Tree-Chart.svg)]() 6 | 7 | > :deciduous_tree: Vue 树形图组件 8 | 9 | ![logo](https://refined-x.com/asset/vtc-logo.png) 10 | 11 | Vue3.x 版本[在这](https://github.com/tower1229/Vue-Tree-Chart/tree/vue3) 12 | 13 | ## 安装 14 | 15 | ```bash 16 | npm i vue-tree-chart --save 17 | ``` 18 | 19 | ## 使用 20 | 21 | in template: 22 | 23 | ```html 24 | 25 | ``` 26 | 27 | in script: 28 | 29 | ```js 30 | import TreeChart from "vue-tree-chart"; 31 | 32 | export default { 33 | components: { 34 | TreeChart 35 | }, 36 | data() { 37 | return { 38 | treeData: { 39 | ... 40 | } 41 | } 42 | } 43 | ... 44 | ``` 45 | 46 | ## 属性 47 | 48 | ### json 49 | 50 | 组件数据，支持字段： 51 | 52 | ```text 53 | - name[String] 节点名称 54 | - image_url[String] 节点图片 55 | - children[Array] 节点后代 56 | - mate[Array] 节点配偶 57 | - class[Array] 节点自定义class，字符串数组 58 | - extend[Boolean] 展开/收起节点后代，默认展开 59 | ``` 60 | 61 | 示例： 62 | 63 | ```js 64 | { 65 | name: 'root', 66 | image_url: "https://static.refined-x.com/avat.jpg", 67 | class: ["rootNode"], 68 | children: [ 69 | { 70 | name: 'children1', 71 | image_url: "https://static.refined-x.com/avat1.jpg" 72 | }, 73 | { 74 | name: 'children2', 75 | image_url: "https://static.refined-x.com/avat2.jpg", 76 | mate: [{ 77 | name: 'mate', 78 | image_url: "https://static.refined-x.com/avat3.jpg" 79 | }], 80 | children: [ 81 | { 82 | name: 'grandchild', 83 | image_url: "https://static.refined-x.com/avat.jpg" 84 | }, 85 | { 86 | name: 'grandchild2', 87 | image_url: "https://static.refined-x.com/avat1.jpg" 88 | }, 89 | { 90 | name: 'grandchild3', 91 | image_url: "https://static.refined-x.com/avat2.jpg" 92 | } 93 | ] 94 | }, 95 | { 96 | name: 'children3', 97 | image_url: "https://static.refined-x.com/avat.jpg" 98 | } 99 | ] 100 | } 101 | ``` 102 | 103 | ## 事件 104 | 105 | ### click-node(node) 106 | 107 | 点击节点触发，接收当前节点数据为参数 108 | 109 | ## 演示 110 | 111 | ```bash 112 | npm run serve 113 | ``` 114 | 115 | ## 构建 116 | 117 | ```bash 118 | npm run build-bundle 119 | ``` 120 | 121 | Copyright (c) 2017-present, [前端路上](http://refined-x.com) 122 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | '@vue/app' 4 | ] 5 | } -------------------------------------------------------------------------------- /dist/TreeChart.common.js: -------------------------------------------------------------------------------- 1 | module.exports = 2 | /******/ (function(modules) { // webpackBootstrap 3 | /******/ // The module cache 4 | /******/ var installedModules = {}; 5 | /******/ 6 | /******/ // The require function 7 | /******/ function __webpack_require__(moduleId) { 8 | /******/ 9 | /******/ // Check if module is in cache 10 | /******/ if(installedModules[moduleId]) { 11 | /******/ return installedModules[moduleId].exports; 12 | /******/ } 13 | /******/ // Create a new module (and put it into the cache) 14 | /******/ var module = installedModules[moduleId] = { 15 | /******/ i: moduleId, 16 | /******/ l: false, 17 | /******/ exports: {} 18 | /******/ }; 19 | /******/ 20 | /******/ // Execute the module function 21 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 22 | /******/ 23 | /******/ // Flag the module as loaded 24 | /******/ module.l = true; 25 | /******/ 26 | /******/ // Return the exports of the module 27 | /******/ return module.exports; 28 | /******/ } 29 | /******/ 30 | /******/ 31 | /******/ // expose the modules object (__webpack_modules__) 32 | /******/ __webpack_require__.m = modules; 33 | /******/ 34 | /******/ // expose the module cache 35 | /******/ __webpack_require__.c = installedModules; 36 | /******/ 37 | /******/ // define getter function for harmony exports 38 | /******/ __webpack_require__.d = function(exports, name, getter) { 39 | /******/ if(!__webpack_require__.o(exports, name)) { 40 | /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); 41 | /******/ } 42 | /******/ }; 43 | /******/ 44 | /******/ // define __esModule on exports 45 | /******/ __webpack_require__.r = function(exports) { 46 | /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { 47 | /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); 48 | /******/ } 49 | /******/ Object.defineProperty(exports, '__esModule', { value: true }); 50 | /******/ }; 51 | /******/ 52 | /******/ // create a fake namespace object 53 | /******/ // mode & 1: value is a module id, require it 54 | /******/ // mode & 2: merge all properties of value into the ns 55 | /******/ // mode & 4: return value when already ns object 56 | /******/ // mode & 8|1: behave like require 57 | /******/ __webpack_require__.t = function(value, mode) { 58 | /******/ if(mode & 1) value = __webpack_require__(value); 59 | /******/ if(mode & 8) return value; 60 | /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; 61 | /******/ var ns = Object.create(null); 62 | /******/ __webpack_require__.r(ns); 63 | /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); 64 | /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); 65 | /******/ return ns; 66 | /******/ }; 67 | /******/ 68 | /******/ // getDefaultExport function for compatibility with non-harmony modules 69 | /******/ __webpack_require__.n = function(module) { 70 | /******/ var getter = module && module.__esModule ? 71 | /******/ function getDefault() { return module['default']; } : 72 | /******/ function getModuleExports() { return module; }; 73 | /******/ __webpack_require__.d(getter, 'a', getter); 74 | /******/ return getter; 75 | /******/ }; 76 | /******/ 77 | /******/ // Object.prototype.hasOwnProperty.call 78 | /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; 79 | /******/ 80 | /******/ // __webpack_public_path__ 81 | /******/ __webpack_require__.p = ""; 82 | /******/ 83 | /******/ 84 | /******/ // Load entry module and return exports 85 | /******/ return __webpack_require__(__webpack_require__.s = "fb15"); 86 | /******/ }) 87 | /************************************************************************/ 88 | /******/ ({ 89 | 90 | /***/ "01f9": 91 | /***/ (function(module, exports, __webpack_require__) { 92 | 93 | "use strict"; 94 | 95 | var LIBRARY = __webpack_require__("2d00"); 96 | var $export = __webpack_require__("5ca1"); 97 | var redefine = __webpack_require__("2aba"); 98 | var hide = __webpack_require__("32e9"); 99 | var Iterators = __webpack_require__("84f2"); 100 | var $iterCreate = __webpack_require__("41a0"); 101 | var setToStringTag = __webpack_require__("7f20"); 102 | var getPrototypeOf = __webpack_require__("38fd"); 103 | var ITERATOR = __webpack_require__("2b4c")('iterator'); 104 | var BUGGY = !([].keys && 'next' in [].keys()); // Safari has buggy iterators w/o `next` 105 | var FF_ITERATOR = '@@iterator'; 106 | var KEYS = 'keys'; 107 | var VALUES = 'values'; 108 | 109 | var returnThis = function () { return this; }; 110 | 111 | module.exports = function (Base, NAME, Constructor, next, DEFAULT, IS_SET, FORCED) { 112 | $iterCreate(Constructor, NAME, next); 113 | var getMethod = function (kind) { 114 | if (!BUGGY && kind in proto) return proto[kind]; 115 | switch (kind) { 116 | case KEYS: return function keys() { return new Constructor(this, kind); }; 117 | case VALUES: return function values() { return new Constructor(this, kind); }; 118 | } return function entries() { return new Constructor(this, kind); }; 119 | }; 120 | var TAG = NAME + ' Iterator'; 121 | var DEF_VALUES = DEFAULT == VALUES; 122 | var VALUES_BUG = false; 123 | var proto = Base.prototype; 124 | var $native = proto[ITERATOR] || proto[FF_ITERATOR] || DEFAULT && proto[DEFAULT]; 125 | var $default = $native || getMethod(DEFAULT); 126 | var $entries = DEFAULT ? !DEF_VALUES ? $default : getMethod('entries') : undefined; 127 | var $anyNative = NAME == 'Array' ? proto.entries || $native : $native; 128 | var methods, key, IteratorPrototype; 129 | // Fix native 130 | if ($anyNative) { 131 | IteratorPrototype = getPrototypeOf($anyNative.call(new Base())); 132 | if (IteratorPrototype !== Object.prototype && IteratorPrototype.next) { 133 | // Set @@toStringTag to native iterators 134 | setToStringTag(IteratorPrototype, TAG, true); 135 | // fix for some old engines 136 | if (!LIBRARY && typeof IteratorPrototype[ITERATOR] != 'function') hide(IteratorPrototype, ITERATOR, returnThis); 137 | } 138 | } 139 | // fix Array#{values, @@iterator}.name in V8 / FF 140 | if (DEF_VALUES && $native && $native.name !== VALUES) { 141 | VALUES_BUG = true; 142 | $default = function values() { return $native.call(this); }; 143 | } 144 | // Define iterator 145 | if ((!LIBRARY || FORCED) && (BUGGY || VALUES_BUG || !proto[ITERATOR])) { 146 | hide(proto, ITERATOR, $default); 147 | } 148 | // Plug for library 149 | Iterators[NAME] = $default; 150 | Iterators[TAG] = returnThis; 151 | if (DEFAULT) { 152 | methods = { 153 | values: DEF_VALUES ? $default : getMethod(VALUES), 154 | keys: IS_SET ? $default : getMethod(KEYS), 155 | entries: $entries 156 | }; 157 | if (FORCED) for (key in methods) { 158 | if (!(key in proto)) redefine(proto, key, methods[key]); 159 | } else $export($export.P + $export.F * (BUGGY || VALUES_BUG), NAME, methods); 160 | } 161 | return methods; 162 | }; 163 | 164 | 165 | /***/ }), 166 | 167 | /***/ "0d58": 168 | /***/ (function(module, exports, __webpack_require__) { 169 | 170 | // 19.1.2.14 / 15.2.3.14 Object.keys(O) 171 | var $keys = __webpack_require__("ce10"); 172 | var enumBugKeys = __webpack_require__("e11e"); 173 | 174 | module.exports = Object.keys || function keys(O) { 175 | return $keys(O, enumBugKeys); 176 | }; 177 | 178 | 179 | /***/ }), 180 | 181 | /***/ "1495": 182 | /***/ (function(module, exports, __webpack_require__) { 183 | 184 | var dP = __webpack_require__("86cc"); 185 | var anObject = __webpack_require__("cb7c"); 186 | var getKeys = __webpack_require__("0d58"); 187 | 188 | module.exports = __webpack_require__("9e1e") ? Object.defineProperties : function defineProperties(O, Properties) { 189 | anObject(O); 190 | var keys = getKeys(Properties); 191 | var length = keys.length; 192 | var i = 0; 193 | var P; 194 | while (length > i) dP.f(O, P = keys[i++], Properties[P]); 195 | return O; 196 | }; 197 | 198 | 199 | /***/ }), 200 | 201 | /***/ "230e": 202 | /***/ (function(module, exports, __webpack_require__) { 203 | 204 | var isObject = __webpack_require__("d3f4"); 205 | var document = __webpack_require__("7726").document; 206 | // typeof document.createElement is 'object' in old IE 207 | var is = isObject(document) && isObject(document.createElement); 208 | module.exports = function (it) { 209 | return is ? document.createElement(it) : {}; 210 | }; 211 | 212 | 213 | /***/ }), 214 | 215 | /***/ "2350": 216 | /***/ (function(module, exports) { 217 | 218 | /* 219 | MIT License http://www.opensource.org/licenses/mit-license.php 220 | Author Tobias Koppers @sokra 221 | */ 222 | // css base code, injected by the css-loader 223 | module.exports = function(useSourceMap) { 224 | var list = []; 225 | 226 | // return the list of modules as css string 227 | list.toString = function toString() { 228 | return this.map(function (item) { 229 | var content = cssWithMappingToString(item, useSourceMap); 230 | if(item[2]) { 231 | return "@media " + item[2] + "{" + content + "}"; 232 | } else { 233 | return content; 234 | } 235 | }).join(""); 236 | }; 237 | 238 | // import a list of modules into the list 239 | list.i = function(modules, mediaQuery) { 240 | if(typeof modules === "string") 241 | modules = [[null, modules, ""]]; 242 | var alreadyImportedModules = {}; 243 | for(var i = 0; i < this.length; i++) { 244 | var id = this[i][0]; 245 | if(typeof id === "number") 246 | alreadyImportedModules[id] = true; 247 | } 248 | for(i = 0; i < modules.length; i++) { 249 | var item = modules[i]; 250 | // skip already imported module 251 | // this implementation is not 100% perfect for weird media query combinations 252 | // when a module is imported multiple times with different media queries. 253 | // I hope this will never occur (Hey this way we have smaller bundles) 254 | if(typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) { 255 | if(mediaQuery && !item[2]) { 256 | item[2] = mediaQuery; 257 | } else if(mediaQuery) { 258 | item[2] = "(" + item[2] + ") and (" + mediaQuery + ")"; 259 | } 260 | list.push(item); 261 | } 262 | } 263 | }; 264 | return list; 265 | }; 266 | 267 | function cssWithMappingToString(item, useSourceMap) { 268 | var content = item[1] || ''; 269 | var cssMapping = item[3]; 270 | if (!cssMapping) { 271 | return content; 272 | } 273 | 274 | if (useSourceMap && typeof btoa === 'function') { 275 | var sourceMapping = toComment(cssMapping); 276 | var sourceURLs = cssMapping.sources.map(function (source) { 277 | return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */' 278 | }); 279 | 280 | return [content].concat(sourceURLs).concat([sourceMapping]).join('\n'); 281 | } 282 | 283 | return [content].join('\n'); 284 | } 285 | 286 | // Adapted from convert-source-map (MIT) 287 | function toComment(sourceMap) { 288 | // eslint-disable-next-line no-undef 289 | var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))); 290 | var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64; 291 | 292 | return '/*# ' + data + ' */'; 293 | } 294 | 295 | 296 | /***/ }), 297 | 298 | /***/ "2aba": 299 | /***/ (function(module, exports, __webpack_require__) { 300 | 301 | var global = __webpack_require__("7726"); 302 | var hide = __webpack_require__("32e9"); 303 | var has = __webpack_require__("69a8"); 304 | var SRC = __webpack_require__("ca5a")('src'); 305 | var $toString = __webpack_require__("fa5b"); 306 | var TO_STRING = 'toString'; 307 | var TPL = ('' + $toString).split(TO_STRING); 308 | 309 | __webpack_require__("8378").inspectSource = function (it) { 310 | return $toString.call(it); 311 | }; 312 | 313 | (module.exports = function (O, key, val, safe) { 314 | var isFunction = typeof val == 'function'; 315 | if (isFunction) has(val, 'name') || hide(val, 'name', key); 316 | if (O[key] === val) return; 317 | if (isFunction) has(val, SRC) || hide(val, SRC, O[key] ? '' + O[key] : TPL.join(String(key))); 318 | if (O === global) { 319 | O[key] = val; 320 | } else if (!safe) { 321 | delete O[key]; 322 | hide(O, key, val); 323 | } else if (O[key]) { 324 | O[key] = val; 325 | } else { 326 | hide(O, key, val); 327 | } 328 | // add fake Function#toString for correct work wrapped methods / constructors with methods like LoDash isNative 329 | })(Function.prototype, TO_STRING, function toString() { 330 | return typeof this == 'function' && this[SRC] || $toString.call(this); 331 | }); 332 | 333 | 334 | /***/ }), 335 | 336 | /***/ "2aeb": 337 | /***/ (function(module, exports, __webpack_require__) { 338 | 339 | // 19.1.2.2 / 15.2.3.5 Object.create(O [, Properties]) 340 | var anObject = __webpack_require__("cb7c"); 341 | var dPs = __webpack_require__("1495"); 342 | var enumBugKeys = __webpack_require__("e11e"); 343 | var IE_PROTO = __webpack_require__("613b")('IE_PROTO'); 344 | var Empty = function () { /* empty */ }; 345 | var PROTOTYPE = 'prototype'; 346 | 347 | // Create object with fake `null` prototype: use iframe Object with cleared prototype 348 | var createDict = function () { 349 | // Thrash, waste and sodomy: IE GC bug 350 | var iframe = __webpack_require__("230e")('iframe'); 351 | var i = enumBugKeys.length; 352 | var lt = '<'; 353 | var gt = '>'; 354 | var iframeDocument; 355 | iframe.style.display = 'none'; 356 | __webpack_require__("fab2").appendChild(iframe); 357 | iframe.src = 'javascript:'; // eslint-disable-line no-script-url 358 | // createDict = iframe.contentWindow.Object; 359 | // html.removeChild(iframe); 360 | iframeDocument = iframe.contentWindow.document; 361 | iframeDocument.open(); 362 | iframeDocument.write(lt + 'script' + gt + 'document.F=Object' + lt + '/script' + gt); 363 | iframeDocument.close(); 364 | createDict = iframeDocument.F; 365 | while (i--) delete createDict[PROTOTYPE][enumBugKeys[i]]; 366 | return createDict(); 367 | }; 368 | 369 | module.exports = Object.create || function create(O, Properties) { 370 | var result; 371 | if (O !== null) { 372 | Empty[PROTOTYPE] = anObject(O); 373 | result = new Empty(); 374 | Empty[PROTOTYPE] = null; 375 | // add "__proto__" for Object.getPrototypeOf polyfill 376 | result[IE_PROTO] = O; 377 | } else result = createDict(); 378 | return Properties === undefined ? result : dPs(result, Properties); 379 | }; 380 | 381 | 382 | /***/ }), 383 | 384 | /***/ "2b4c": 385 | /***/ (function(module, exports, __webpack_require__) { 386 | 387 | var store = __webpack_require__("5537")('wks'); 388 | var uid = __webpack_require__("ca5a"); 389 | var Symbol = __webpack_require__("7726").Symbol; 390 | var USE_SYMBOL = typeof Symbol == 'function'; 391 | 392 | var $exports = module.exports = function (name) { 393 | return store[name] || (store[name] = 394 | USE_SYMBOL && Symbol[name] || (USE_SYMBOL ? Symbol : uid)('Symbol.' + name)); 395 | }; 396 | 397 | $exports.store = store; 398 | 399 | 400 | /***/ }), 401 | 402 | /***/ "2d00": 403 | /***/ (function(module, exports) { 404 | 405 | module.exports = false; 406 | 407 | 408 | /***/ }), 409 | 410 | /***/ "2d95": 411 | /***/ (function(module, exports) { 412 | 413 | var toString = {}.toString; 414 | 415 | module.exports = function (it) { 416 | return toString.call(it).slice(8, -1); 417 | }; 418 | 419 | 420 | /***/ }), 421 | 422 | /***/ "32e9": 423 | /***/ (function(module, exports, __webpack_require__) { 424 | 425 | var dP = __webpack_require__("86cc"); 426 | var createDesc = __webpack_require__("4630"); 427 | module.exports = __webpack_require__("9e1e") ? function (object, key, value) { 428 | return dP.f(object, key, createDesc(1, value)); 429 | } : function (object, key, value) { 430 | object[key] = value; 431 | return object; 432 | }; 433 | 434 | 435 | /***/ }), 436 | 437 | /***/ "38fd": 438 | /***/ (function(module, exports, __webpack_require__) { 439 | 440 | // 19.1.2.9 / 15.2.3.2 Object.getPrototypeOf(O) 441 | var has = __webpack_require__("69a8"); 442 | var toObject = __webpack_require__("4bf8"); 443 | var IE_PROTO = __webpack_require__("613b")('IE_PROTO'); 444 | var ObjectProto = Object.prototype; 445 | 446 | module.exports = Object.getPrototypeOf || function (O) { 447 | O = toObject(O); 448 | if (has(O, IE_PROTO)) return O[IE_PROTO]; 449 | if (typeof O.constructor == 'function' && O instanceof O.constructor) { 450 | return O.constructor.prototype; 451 | } return O instanceof Object ? ObjectProto : null; 452 | }; 453 | 454 | 455 | /***/ }), 456 | 457 | /***/ "41a0": 458 | /***/ (function(module, exports, __webpack_require__) { 459 | 460 | "use strict"; 461 | 462 | var create = __webpack_require__("2aeb"); 463 | var descriptor = __webpack_require__("4630"); 464 | var setToStringTag = __webpack_require__("7f20"); 465 | var IteratorPrototype = {}; 466 | 467 | // 25.1.2.1.1 %IteratorPrototype%[@@iterator]() 468 | __webpack_require__("32e9")(IteratorPrototype, __webpack_require__("2b4c")('iterator'), function () { return this; }); 469 | 470 | module.exports = function (Constructor, NAME, next) { 471 | Constructor.prototype = create(IteratorPrototype, { next: descriptor(1, next) }); 472 | setToStringTag(Constructor, NAME + ' Iterator'); 473 | }; 474 | 475 | 476 | /***/ }), 477 | 478 | /***/ "4588": 479 | /***/ (function(module, exports) { 480 | 481 | // 7.1.4 ToInteger 482 | var ceil = Math.ceil; 483 | var floor = Math.floor; 484 | module.exports = function (it) { 485 | return isNaN(it = +it) ? 0 : (it > 0 ? floor : ceil)(it); 486 | }; 487 | 488 | 489 | /***/ }), 490 | 491 | /***/ "4630": 492 | /***/ (function(module, exports) { 493 | 494 | module.exports = function (bitmap, value) { 495 | return { 496 | enumerable: !(bitmap & 1), 497 | configurable: !(bitmap & 2), 498 | writable: !(bitmap & 4), 499 | value: value 500 | }; 501 | }; 502 | 503 | 504 | /***/ }), 505 | 506 | /***/ "499e": 507 | /***/ (function(module, __webpack_exports__, __webpack_require__) { 508 | 509 | "use strict"; 510 | __webpack_require__.r(__webpack_exports__); 511 | 512 | // CONCATENATED MODULE: ./node_modules/vue-style-loader/lib/listToStyles.js 513 | /** 514 | * Translates the list format produced by css-loader into something 515 | * easier to manipulate. 516 | */ 517 | function listToStyles (parentId, list) { 518 | var styles = [] 519 | var newStyles = {} 520 | for (var i = 0; i < list.length; i++) { 521 | var item = list[i] 522 | var id = item[0] 523 | var css = item[1] 524 | var media = item[2] 525 | var sourceMap = item[3] 526 | var part = { 527 | id: parentId + ':' + i, 528 | css: css, 529 | media: media, 530 | sourceMap: sourceMap 531 | } 532 | if (!newStyles[id]) { 533 | styles.push(newStyles[id] = { id: id, parts: [part] }) 534 | } else { 535 | newStyles[id].parts.push(part) 536 | } 537 | } 538 | return styles 539 | } 540 | 541 | // CONCATENATED MODULE: ./node_modules/vue-style-loader/lib/addStylesClient.js 542 | /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return addStylesClient; }); 543 | /* 544 | MIT License http://www.opensource.org/licenses/mit-license.php 545 | Author Tobias Koppers @sokra 546 | Modified by Evan You @yyx990803 547 | */ 548 | 549 | 550 | 551 | var hasDocument = typeof document !== 'undefined' 552 | 553 | if (typeof DEBUG !== 'undefined' && DEBUG) { 554 | if (!hasDocument) { 555 | throw new Error( 556 | 'vue-style-loader cannot be used in a non-browser environment. ' + 557 | "Use { target: 'node' } in your Webpack config to indicate a server-rendering environment." 558 | ) } 559 | } 560 | 561 | /* 562 | type StyleObject = { 563 | id: number; 564 | parts: Array 565 | } 566 | 567 | type StyleObjectPart = { 568 | css: string; 569 | media: string; 570 | sourceMap: ?string 571 | } 572 | */ 573 | 574 | var stylesInDom = {/* 575 | [id: number]: { 576 | id: number, 577 | refs: number, 578 | parts: Array<(obj?: StyleObjectPart) => void> 579 | } 580 | */} 581 | 582 | var head = hasDocument && (document.head || document.getElementsByTagName('head')[0]) 583 | var singletonElement = null 584 | var singletonCounter = 0 585 | var isProduction = false 586 | var noop = function () {} 587 | var options = null 588 | var ssrIdKey = 'data-vue-ssr-id' 589 | 590 | // Force single-tag solution on IE6-9, which has a hard limit on the # of \n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TreeChart.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TreeChart.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./TreeChart.vue?vue&type=template&id=3e1326fa&scoped=true&\"\nimport script from \"./TreeChart.vue?vue&type=script&lang=js&\"\nexport * from \"./TreeChart.vue?vue&type=script&lang=js&\"\nimport style0 from \"./TreeChart.vue?vue&type=style&index=0&id=3e1326fa&scoped=true&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n \"3e1326fa\",\n null\n \n)\n\nexport default component.exports","\r\n\r\n\r\n\r\n\r\n","import mod from \"-!../node_modules/cache-loader/dist/cjs.js??ref--12-0!../node_modules/thread-loader/dist/cjs.js!../node_modules/babel-loader/lib/index.js!../node_modules/cache-loader/dist/cjs.js??ref--0-0!../node_modules/vue-loader/lib/index.js??vue-loader-options!./App.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../node_modules/cache-loader/dist/cjs.js??ref--12-0!../node_modules/thread-loader/dist/cjs.js!../node_modules/babel-loader/lib/index.js!../node_modules/cache-loader/dist/cjs.js??ref--0-0!../node_modules/vue-loader/lib/index.js??vue-loader-options!./App.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./App.vue?vue&type=template&id=4c57bf61&\"\nimport script from \"./App.vue?vue&type=script&lang=js&\"\nexport * from \"./App.vue?vue&type=script&lang=js&\"\nimport style0 from \"./App.vue?vue&type=style&index=0&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n null,\n null\n \n)\n\nexport default component.exports","import Vue from 'vue'\nimport App from './App.vue'\n\nVue.config.productionTip = false\n\nnew Vue({\n render: h => h(App)\n}).$mount('#app')\n","import mod from \"-!../../node_modules/vue-style-loader/index.js??ref--6-oneOf-1-0!../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TreeChart.vue?vue&type=style&index=0&id=3e1326fa&scoped=true&lang=css&\"; export default mod; export * from \"-!../../node_modules/vue-style-loader/index.js??ref--6-oneOf-1-0!../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TreeChart.vue?vue&type=style&index=0&id=3e1326fa&scoped=true&lang=css&\"","// style-loader: Adds some css to the DOM by adding a 104 | -------------------------------------------------------------------------------- /src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tower1229/Vue-Tree-Chart/804c6bf5ec873d4deda74d935668cc5238aaf6ea/src/assets/logo.png -------------------------------------------------------------------------------- /src/components/TreeChart.vue: -------------------------------------------------------------------------------- 1 | 39 | 40 | 76 | 77 | 112 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | Vue.config.productionTip = false 5 | 6 | new Vue({ 7 | render: h => h(App) 8 | }).$mount('#app') 9 | -------------------------------------------------------------------------------- /vue.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | outputDir: 'docs', 3 | publicPath: process.env.NODE_ENV === 'production' ? 4 | '/Vue-Tree-Chart/' : '/', 5 | css: { 6 | extract: false 7 | } 8 | } --------------------------------------------------------------------------------