hizzgdev · Dec 21, 2023 · Jan 2, 2024 · Jan 2, 2024 · Jan 2, 2024 · Jan 2, 2024
diff --git a/.config/rollup.config.js b/.config/rollup.config.js
@@ -1,5 +1,5 @@
 import cleanup from 'rollup-plugin-cleanup';
-import { terser } from 'rollup-plugin-terser';
+import terser from '@rollup/plugin-terser';
 
 export default [
     {
@@ -8,7 +8,7 @@ export default [
             name: 'jsMind',
             file: 'es6/jsmind.js',
             format: 'umd',
-            banner: '/**\n* @license BSD-3-Clause\n* @copyright 2014-2023 hizzgdev@163.com\n*\n* Project Home:\n*   https://github.com/hizzgdev/jsmind/\n*/',
+            banner: '/**\n* @license BSD-3-Clause\n* @copyright 2014-2025 hizzgdev@163.com\n*\n* Project Home:\n*   https://github.com/hizzgdev/jsmind/\n*/',
             sourcemap: true,
         },
         plugins: [
@@ -27,7 +27,7 @@ export default [
         output: {
             file: 'es6/jsmind.draggable-node.js',
             format: 'umd',
-            banner: '/**\n* @license BSD-3-Clause\n* @copyright 2014-2023 hizzgdev@163.com\n*\n* Project Home:\n*   https://github.com/hizzgdev/jsmind/\n*/',
+            banner: '/**\n* @license BSD-3-Clause\n* @copyright 2014-2025 hizzgdev@163.com\n*\n* Project Home:\n*   https://github.com/hizzgdev/jsmind/\n*/',
             sourcemap: true,
             globals: {
                 jsmind: 'jsMind',
@@ -50,7 +50,7 @@ export default [
         output: {
             file: 'es6/jsmind.screenshot.js',
             format: 'umd',
-            banner: '/**\n* @license BSD-3-Clause\n* @copyright 2014-2023 hizzgdev@163.com\n*\n* Project Home:\n*   https://github.com/hizzgdev/jsmind/\n*/',
+            banner: '/**\n* @license BSD-3-Clause\n* @copyright 2014-2025 hizzgdev@163.com\n*\n* Project Home:\n*   https://github.com/hizzgdev/jsmind/\n*/',
             sourcemap: true,
             globals: {
                 'jsmind': 'jsMind',

diff --git a/LICENSE b/LICENSE
@@ -1,4 +1,4 @@
-Copyright (c) 2014-2023, ZHANG ZHIGANG <hizzgdev@163.com>
+Copyright (c) 2014-2025, ZHANG ZHIGANG <hizzgdev@163.com>
 All rights reserved.
 
 Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
@@ -11,7 +11,7 @@ THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
 
 
 
-版权所有 (c) 2014-2023, 张志刚 <hizzgdev@163.com>
+版权所有 (c) 2014-2025, 张志刚 <hizzgdev@163.com>
 保留一切权利。
 
 在满足下列条件的前提下，授予使用者使用及再发布本软件的源代码或二进制形式的权利，无论是否修改皆然：

diff --git a/README.md b/README.md
@@ -20,11 +20,11 @@ jsMind is mind map library built by javascript, it base on html5 canvas and svg.
         <link
             type="text/css"
             rel="stylesheet"
-            href="//cdn.jsdelivr.net/npm/jsmind@0.7.9/style/jsmind.css"
+            href="//cdn.jsdelivr.net/npm/jsmind@0.8.6/style/jsmind.css"
         />
         <script
             type="text/javascript"
-            src="//cdn.jsdelivr.net/npm/jsmind@0.7.9/es6/jsmind.js"
+            src="//cdn.jsdelivr.net/npm/jsmind@0.8.6/es6/jsmind.js"
         ></script>
     </head>
     <body>
@@ -58,12 +58,11 @@ jsMind is mind map library built by javascript, it base on html5 canvas and svg.
         -   [jsDelivr 国内镜像](https://jsd.onmicrosoft.cn/npm/jsmind/)
 -   Apps :
     -   <https://jsmind.online>
-    -   <https://jsmind.sinaapp.com>
 -   Demo :
     -   [显示一个脑图 Render a mindmap](https://hizzgdev.github.io/jsmind/example/1_basic.html) [[国内版](https://hizzgdev.github.io/jsmind/example/1_basic_cn.html)]
     -   [试用所有功能 Try all features](https://hizzgdev.github.io/jsmind/example/2_features.html) [[国内版](https://hizzgdev.github.io/jsmind/example/2_features_cn.html)]
     -   [requirejs + jsMind](https://hizzgdev.github.io/jsmind/example/3_requirejs.html)
-    -   [更多示例 - More samples](https://github.com/hizzgdev/jsmind-samples)
+    -   [更多示例 - More samples](https://github.com/hizzgdev/jsmind-samples) [[国内版](https://gitee.com/hizzgdev/jsmind-samples)]
 
 ## Funding
 

diff --git a/docs/en/1.usage.md b/docs/en/1.usage.md
@@ -14,22 +14,22 @@
 At first, 2 files (jsmind.css and jsmind.js) are required. Here we link to the resources on the CDN. It is recommended to use the latest version.
 
 ```html
-<link type="text/css" rel="stylesheet" href="https://unpkg.com/jsmind@0.7.9/style/jsmind.css" />
+<link type="text/css" rel="stylesheet" href="https://unpkg.com/jsmind@0.8.6/style/jsmind.css" />
 
-<script type="text/javascript" src="https://unpkg.com/jsmind@0.7.9/es6/jsmind.js"></script>
+<script type="text/javascript" src="https://unpkg.com/jsmind@0.8.6/es6/jsmind.js"></script>
 
 ```
 > CDNs in common use: [UNPKG](https://unpkg.com/jsmind/), [jsDelivr](https://www.jsdelivr.com/package/npm/jsmind/), and [the mirror of jsDelivr in China](https://jsd.onmicrosoft.cn/npm/jsmind/). the resource urls would look like:
-> - https://unpkg.com/jsmind@0.7.9/es6/jsmind.js
-> - https://cdn.jsdelivr.net/npm/jsmind@0.7.9/es6/jsmind.js
-> - https://jsd.onmicrosoft.cn/npm/jsmind@0.7.9/es6/jsmind.js
+> - https://unpkg.com/jsmind@0.8.6/es6/jsmind.js
+> - https://cdn.jsdelivr.net/npm/jsmind@0.8.6/es6/jsmind.js
+> - https://jsd.onmicrosoft.cn/npm/jsmind@0.8.6/es6/jsmind.js
 >
 > The version number appear in the url of CDN. It's strongly recommended that you also specify the version number in your project to avoid the risks that caused by version upgrades. Access the [jsMind on NPM](https://www.npmjs.com/package/jsmind) to get the latest version number of jsMind.
 
 Add script jsmind.draggable-node.js for enabling draggable node feature.
 
 ```html
-<script type="text/javascript" src="https://unpkg.com/jsmind@0.7.9/es6/jsmind.draggable-node.js"></script>
+<script type="text/javascript" src="https://unpkg.com/jsmind@0.8.6/es6/jsmind.draggable-node.js"></script>
 ```
 
 The second, a div element should be in your HTML as container

diff --git a/docs/en/2.options.md b/docs/en/2.options.md
@@ -39,6 +39,7 @@ options = {
        line_width:2, 		// thickness of the mindmap line
        line_color:'#555', 	// Thought mindmap line color
        line_style:'curved', // line style, straight or curved
+       custom_line_render: null,  // customized line render function
        draggable: false,    // Drag the mind map with your mouse, when it's larger that the container
        hide_scrollbars_when_draggable: false, // Hide container scrollbars, when mind map is larger than container and draggable option is true.
        node_overflow: 'hidden' // Text overflow style in node
@@ -121,6 +122,10 @@ These options are described in more detail below.
 > * `canvas` - Draw the lines on the canvas [default]
 > * `svg` - Using SVG to draw lines, when there are a lot of nodes and a huge area in the mind map, using this mode can bring significant performance improvements
 
+**view.enable_device_pixel_ratio** : (bool) draw HD mindmap according to the device pixel ratio. (since 0.8.5)
+
+> This parameter is only used to improve the mindmap resolution when `view.engine=canvas`. It does not need to be set when the engine is `svg`.
+
 **view.hmargin** : (number) Minimum horizontal distance (in pixels) of the mindmap from the container frame  
 **view.vmargin** : (number) Minimum vertical distance (in pixels) of the mindmap from the outer container frame
 
@@ -134,6 +139,12 @@ These options are described in more detail below.
 > * `curved` [default]
 > * `straight`
 
+**view.custom_line_render** : (function) customize the line render function
+
+> * method signature: `function custom_line_render({ctx, start_point: {x, y}, end_point: {x, y}}):void`
+> * `this` presents [current line renderer](https://github.com/hizzgdev/jsmind/blob/master/src/jsmind.graph.js)，`ctx` is a canvas context object or a SVG path DOM object, which is determined by `view.engine`, `start_point` and `end_point` are two coordinates object, contains `x` and `y` properties.
+> * Note: if you want use [`this`](https://github.com/hizzgdev/jsmind/blob/master/src/jsmind.graph.js) object, you should NOT use Arrow Function expressions.
+
 **view.draggable** : (bool) Do you want whole mind map draggable inside container?
 
 > The default value of this parameter is false, as it keep the default behavior with vertical and horizontal scrollbars on the container when mind map is bigger than the container.

diff --git a/docs/en/plugin-screenshot.md b/docs/en/plugin-screenshot.md
@@ -18,16 +18,16 @@ This feature can support to export mind maps as png images.
 ```html
 
 <!-- style -->
-<link type="text/css" rel="stylesheet" href="https://unpkg.com/jsmind@0.7.9/style/jsmind.css" />
+<link type="text/css" rel="stylesheet" href="https://unpkg.com/jsmind@0.8.6/style/jsmind.css" />
 
 <!-- jsMind -->
-<script type="text/javascript" src="https://unpkg.com/jsmind@0.7.9/es6/jsmind.js"></script>
+<script type="text/javascript" src="https://unpkg.com/jsmind@0.8.6/es6/jsmind.js"></script>
 
 <!-- dependency of screenshot -->
 <script type="text/javascript" src="https://unpkg.com/dom-to-image@2.6.0/dist/dom-to-image.min.js" ></script>
 
 <!-- screenshot plugin -->
-<script type="text/javascript" src="https://unpkg.com/jsmind@0.7.9/es6/jsmind.screenshot.js"></script>
+<script type="text/javascript" src="https://unpkg.com/jsmind@0.8.6/es6/jsmind.screenshot.js"></script>
 
 
 <script>

diff --git a/docs/zh/1.usage.md b/docs/zh/1.usage.md
@@ -15,22 +15,22 @@
 
 
 ```html
-<link type="text/css" rel="stylesheet" href="https://unpkg.com/jsmind@0.7.9/style/jsmind.css" />
+<link type="text/css" rel="stylesheet" href="https://unpkg.com/jsmind@0.8.6/style/jsmind.css" />
 
-<script type="text/javascript" src="https://unpkg.com/jsmind@0.7.9/es6/jsmind.js"></script>
+<script type="text/javascript" src="https://unpkg.com/jsmind@0.8.6/es6/jsmind.js"></script>
 ```
 
 > 常用的 CDN 有 [UNPKG](https://unpkg.com/jsmind/)，[jsDelivr](https://www.jsdelivr.com/package/npm/jsmind/)，以及 jsDelivr 的[国内镜像](https://jsd.onmicrosoft.cn/npm/jsmind/)。文件路径大概像这样：
-> - https://unpkg.com/jsmind@0.7.9/es6/jsmind.js
-> - https://cdn.jsdelivr.net/npm/jsmind@0.7.9/es6/jsmind.js
-> - https://jsd.onmicrosoft.cn/npm/jsmind@0.7.9/es6/jsmind.js
+> - https://unpkg.com/jsmind@0.8.6/es6/jsmind.js
+> - https://cdn.jsdelivr.net/npm/jsmind@0.8.6/es6/jsmind.js
+> - https://jsd.onmicrosoft.cn/npm/jsmind@0.8.6/es6/jsmind.js
 >
 > 示例中url中都有版本号，强烈建议你在项目里也指明版本号，以避免版本升级给你的项目带来风险。访问 [NPM 上的 jsMind](https://www.npmjs.com/package/jsmind) 可以获取 jsmind 的最新版本号。
 
 如果希望能够通过鼠标拖拽的方式移动节点，需要额外引用 jsmind.draggable-node.js 文件
 
 ```html
-<script type="text/javascript" src="https://unpkg.com/jsmind@0.7.9/es6/jsmind.draggable-node.js"></script>
+<script type="text/javascript" src="https://unpkg.com/jsmind@0.8.6/es6/jsmind.draggable-node.js"></script>
 ```
 
 其次，要为 jsMind 准备一个容器，jsMind 将在这个容器里显示思维导图。可自行定义容器的id、大小及样式。

diff --git a/docs/zh/2.options.md b/docs/zh/2.options.md
@@ -39,9 +39,10 @@ options = {
        line_width:2,       // 思维导图线条的粗细
        line_color:'#555',  // 思维导图线条的颜色
        line_style:'curved',// 思维导图线条的样式，直线(straight)或者曲线(curved)
+       custom_line_render: null,  // 自定义的线条渲染方法
        draggable: false,   // 当容器不能完全容纳思维导图时，是否允许拖动画布代替鼠标滚动
        hide_scrollbars_when_draggable: false, // 当设置 draggable = true 时，是否隐藏滚动条
-       node_overflow: 'hidden' // 节点文本过长时的样式
+       node_overflow: 'hidden', // 节点文本过长时的样式
        zoom: {             // 配置缩放
            min: 0.5,       // 最小的缩放比例
            max: 2.1,       // 最大的缩放比例
@@ -125,6 +126,10 @@ options = {
 > * `canvas` - 把线条绘制在 canvas 上 [默认值]
 > * `svg` - 使用 svg 绘制线条，当思维导图的节点很多，面积巨大的时候，使用该模式能带来显著的性能提升
 
+**view.enable_device_pixel_ratio** : (bool) 按设备像素比例绘制高清思维导图。 (0.8.5 及以上版本支持)
+
+> 此参数仅用于改善 canvas 的绘制效果，当绘制引擎设置为 svg 时则无须设置。
+
 **view.hmargin** : (number) 思维导图距容器外框的最小水平距离（像素）  
 **view.vmargin** : (number) 思维导图距容器外框的最小垂直距离（像素）
 
@@ -140,6 +145,12 @@ options = {
 > * `curved` 表示曲线 [默认值]
 > * `straight` 表示直线
 
+**view.custom_line_render** : (function) 自定义思维导图线条的渲染方法
+
+> * 方法参数签名: `function custom_line_render({ctx, start_point: {x, y}, end_point: {x, y}}):void` 
+> * `this`对应[当前渲染的线条对象](https://github.com/hizzgdev/jsmind/blob/master/src/jsmind.graph.js)，`ctx` 是一个 canvas 上下文对象或一个标签名为`path`的DOM对象，具体取决于`view.engine`的值，`start_point` 和 `end_point` 是起始点的坐标对象，坐标对象包含 `x` 和 `y` 属性。 
+> * 注意: 如果你想要使用[`this`](https://github.com/hizzgdev/jsmind/blob/master/src/jsmind.graph.js)对象, 请不要使用箭头函数
+
 **view.draggable** : (bool) 当容器不能完全容纳思维导图时，是否允许拖动画布代替鼠标滚动
 
 > 当思维导图不能在容器中完全显示时，默认情况下容器内会出现滚动条。开启此选项后，将允许通过拖拽画布的方式查看思维导图的不同部分。此参数默认值为 `false` (不开启此功能)

diff --git a/docs/zh/plugin-screenshot.md b/docs/zh/plugin-screenshot.md
@@ -20,16 +20,16 @@
 ```html
 
 <!-- style -->
-<link type="text/css" rel="stylesheet" href="https://unpkg.com/jsmind@0.7.9/style/jsmind.css" />
+<link type="text/css" rel="stylesheet" href="https://unpkg.com/jsmind@0.8.6/style/jsmind.css" />
 
 <!-- jsMind -->
-<script type="text/javascript" src="https://unpkg.com/jsmind@0.7.9/es6/jsmind.js"></script>
+<script type="text/javascript" src="https://unpkg.com/jsmind@0.8.6/es6/jsmind.js"></script>
 
 <!-- dependency of screenshot -->
 <script type="text/javascript" src="https://unpkg.com/dom-to-image@2.6.0/dist/dom-to-image.min.js" ></script>
 
 <!-- screenshot plugin -->
-<script type="text/javascript" src="https://unpkg.com/jsmind@0.7.9/es6/jsmind.screenshot.js"></script>
+<script type="text/javascript" src="https://unpkg.com/jsmind@0.8.6/es6/jsmind.screenshot.js"></script>
 
 
 <script>

diff --git a/example/1_basic.html b/example/1_basic.html
@@ -7,7 +7,7 @@
         <link
             type="text/css"
             rel="stylesheet"
-            href="//cdn.jsdelivr.net/npm/jsmind@0.7.9/style/jsmind.css"
+            href="//cdn.jsdelivr.net/npm/jsmind@0.8.6/style/jsmind.css"
         />
         <style type="text/css">
             #jsmind_container {
@@ -21,8 +21,8 @@
 
     <body>
         <div id="jsmind_container"></div>
-        <script src="//cdn.jsdelivr.net/npm/jsmind@0.7.9/es6/jsmind.js"></script>
-        <script src="//cdn.jsdelivr.net/npm/jsmind@0.7.9/es6/jsmind.draggable-node.js"></script>
+        <script src="//cdn.jsdelivr.net/npm/jsmind@0.8.6/es6/jsmind.js"></script>
+        <script src="//cdn.jsdelivr.net/npm/jsmind@0.8.6/es6/jsmind.draggable-node.js"></script>
         <script type="text/javascript">
             function load_jsmind() {
                 var mind = {

diff --git a/example/1_basic_cn.html b/example/1_basic_cn.html
@@ -7,7 +7,7 @@
         <link
             type="text/css"
             rel="stylesheet"
-            href="//jsd.onmicrosoft.cn/npm/jsmind@0.7.9/style/jsmind.css"
+            href="//jsd.onmicrosoft.cn/npm/jsmind@0.8.6/style/jsmind.css"
         />
         <style type="text/css">
             #jsmind_container {
@@ -21,8 +21,8 @@
 
     <body>
         <div id="jsmind_container"></div>
-        <script src="//jsd.onmicrosoft.cn/npm/jsmind@0.7.9/es6/jsmind.js"></script>
-        <script src="//jsd.onmicrosoft.cn/npm/jsmind@0.7.9/es6/jsmind.draggable-node.js"></script>
+        <script src="//jsd.onmicrosoft.cn/npm/jsmind@0.8.6/es6/jsmind.js"></script>
+        <script src="//jsd.onmicrosoft.cn/npm/jsmind@0.8.6/es6/jsmind.draggable-node.js"></script>
         <script type="text/javascript">
             function load_jsmind() {
                 var mind = {

diff --git a/example/2_features.html b/example/2_features.html
@@ -7,7 +7,7 @@
         <link
             type="text/css"
             rel="stylesheet"
-            href="//cdn.jsdelivr.net/npm/jsmind@0.7.9/style/jsmind.css"
+            href="//cdn.jsdelivr.net/npm/jsmind@0.8.6/style/jsmind.css"
         />
         <style type="text/css">
             li {
@@ -52,7 +52,7 @@
                 <div>1. Open</div>
                 <ol type="A">
                     <li><button onclick="open_json();">open example</button></li>
-                    <li><button onclick="open_ajax();">open remote</button></li>
+                    <li><button onclick="open_remote();">open remote</button></li>
                     <li>
                         <button onclick="prompt_info('see 6.Multi Format');">
                             open local file
@@ -192,19 +192,19 @@
         </div>
         <script
             type="text/javascript"
-            src="//cdn.jsdelivr.net/npm/jsmind@0.7.9/es6/jsmind.js"
+            src="//cdn.jsdelivr.net/npm/jsmind@0.8.6/es6/jsmind.js"
         ></script>
         <script
             type="text/javascript"
-            src="//cdn.jsdelivr.net/npm/jsmind@0.7.9/es6/jsmind.draggable-node.js"
+            src="//cdn.jsdelivr.net/npm/jsmind@0.8.6/es6/jsmind.draggable-node.js"
         ></script>
         <script
             type="text/javascript"
             src="//cdn.jsdelivr.net/npm/dom-to-image@2.6.0/dist/dom-to-image.min.js"
         ></script>
         <script
             type="text/javascript"
-            src="//cdn.jsdelivr.net/npm/jsmind@0.7.9/es6/jsmind.screenshot.js"
+            src="//cdn.jsdelivr.net/npm/jsmind@0.8.6/es6/jsmind.screenshot.js"
         ></script>
         <script type="text/javascript" src="2_features.js"></script>
     </body>

diff --git a/example/2_features.js b/example/2_features.js
@@ -4,8 +4,16 @@ function open_empty() {
         container: 'jsmind_container',
         theme: 'greensea',
         editable: true,
+        log_level: 'debug',
         view: {
+            engine: 'canvas',
             draggable: true,
+            enable_device_pixel_ratio: false,
+        },
+        plugin: {
+            screenshot: {
+                background: '#ffffff',
+            },
         },
     };
     _jm = new jsMind(options);
@@ -80,11 +88,10 @@ function open_json() {
     _jm.show(mind);
 }
 
-function open_ajax() {
-    var mind_url = 'data_example.json';
-    jsMind.util.ajax.get(mind_url, function (mind) {
-        _jm.show(mind);
-    });
+function open_remote() {
+    fetch('data_example.json')
+        .then(resp => resp.json())
+        .then(mind => _jm.show(mind));
 }
 
 function screen_shot() {

diff --git a/example/2_features_cn.html b/example/2_features_cn.html
@@ -7,7 +7,7 @@
         <link
             type="text/css"
             rel="stylesheet"
-            href="//jsd.onmicrosoft.cn/npm/jsmind@0.7.9/style/jsmind.css"
+            href="//jsd.onmicrosoft.cn/npm/jsmind@0.8.6/style/jsmind.css"
         />
         <style type="text/css">
             li {
@@ -59,7 +59,7 @@
                 <div>1. Open</div>
                 <ol type="A">
                     <li><button onclick="open_json();">open example</button></li>
-                    <li><button onclick="open_ajax();">open remote</button></li>
+                    <li><button onclick="open_remote();">open remote</button></li>
                     <li>
                         <button onclick="prompt_info('see 6.Multi Format');">
                             open local file
@@ -199,19 +199,19 @@
         </div>
         <script
             type="text/javascript"
-            src="//jsd.onmicrosoft.cn/npm/jsmind@0.7.9/es6/jsmind.js"
+            src="//jsd.onmicrosoft.cn/npm/jsmind@0.8.6/es6/jsmind.js"
         ></script>
         <script
             type="text/javascript"
-            src="//jsd.onmicrosoft.cn/npm/jsmind@0.7.9/es6/jsmind.draggable-node.js"
+            src="//jsd.onmicrosoft.cn/npm/jsmind@0.8.6/es6/jsmind.draggable-node.js"
         ></script>
         <script
             type="text/javascript"
             src="//jsd.onmicrosoft.cn/npm/dom-to-image@2.6.0/dist/dom-to-image.min.js"
         ></script>
         <script
             type="text/javascript"
-            src="//jsd.onmicrosoft.cn/npm/jsmind@0.7.9/es6/jsmind.screenshot.js"
+            src="//jsd.onmicrosoft.cn/npm/jsmind@0.8.6/es6/jsmind.screenshot.js"
         ></script>
         <script type="text/javascript" src="2_features.js"></script>
     </body>