diff --git a/docs/404.html b/docs/404.html index 61b4c5d..92ad5f2 100644 --- a/docs/404.html +++ b/docs/404.html @@ -15,7 +15,7 @@
- + \ No newline at end of file diff --git a/docs/assets/en-US_element_info.md.CXzazgBf.js b/docs/assets/en-US_element_info.md.DNekkoUZ.js similarity index 89% rename from docs/assets/en-US_element_info.md.CXzazgBf.js rename to docs/assets/en-US_element_info.md.DNekkoUZ.js index 077d77a..77f5fa8 100644 --- a/docs/assets/en-US_element_info.md.CXzazgBf.js +++ b/docs/assets/en-US_element_info.md.DNekkoUZ.js @@ -9,12 +9,12 @@ import{_ as s,c as i,o as a,a1 as t,j as n}from"./chunks/framework.DVk8Vg-1.js"; angle?: number; detail: any; // Different element has different description operations?: { - lock?: boolean; + locked?: boolean; invisible?: boolean; limitRatio?: boolean; }; extension?: { [key: string]: any } | any; -};

Element Basic Properties ​

PropertyDescriptionTypeDefaultRequiredOthers
typeElement typetext| rect| circle| image| svg | html-true-
uuidElement unique IDstring-falseThe UUID is automatically added internally in iDraw.js
nameElement namestring-false-
xX-axis offsetnumber-true-
yY-axis offsetnumber-true-
wElement widthnumber-true-
hElement heightnumber-true-
angleElement rotation anglenumber0false[0, 360]
lockSet the lock-staus of elementbooleanfalsefalseThe view operation cannot be controlled after the element is locked
detailDetail of different elementsobject (Please check the description of each element for details)-true-
operation.lockSet the lock-staus of elementbooleanfalsefalseThe view operation cannot be controlled after the element is locked
operation.invisible-booleanfalsefalse-
operation.limitRatioLimit element width and height ratioboolean-falseWhen the element is scaled, it is scaled according to its width and height ratio

Usage of Elements ​

js
import { iDraw } from 'idraw';
+};

Element Basic Properties ​

PropertyDescriptionTypeDefaultRequiredOthers
typeElement typetext| rect| circle| image| svg | html-true-
uuidElement unique IDstring-falseThe UUID is automatically added internally in iDraw.js
nameElement namestring-false-
xX-axis offsetnumber-true-
yY-axis offsetnumber-true-
wElement widthnumber-true-
hElement heightnumber-true-
angleElement rotation anglenumber0false[0, 360]
lockedSet the lock-staus of elementbooleanfalsefalseThe view operation cannot be controlled after the element is locked
detailDetail of different elementsobject (Please check the description of each element for details)-true-
operation.lockedSet the locked-staus of elementbooleanfalsefalseThe view operation cannot be controlled after the element is locked
operation.invisible-booleanfalsefalse-
operation.limitRatioLimit element width and height ratioboolean-falseWhen the element is scaled, it is scaled according to its width and height ratio

Usage of Elements ​

js
import { iDraw } from 'idraw';
 
 import { iDraw } from 'idraw';
 const data = {
diff --git a/docs/assets/en-US_element_info.md.CXzazgBf.lean.js b/docs/assets/en-US_element_info.md.DNekkoUZ.lean.js
similarity index 100%
rename from docs/assets/en-US_element_info.md.CXzazgBf.lean.js
rename to docs/assets/en-US_element_info.md.DNekkoUZ.lean.js
diff --git a/docs/assets/zh-CN_element_info.md.Bx5o2UrA.js b/docs/assets/zh-CN_element_info.md.9W7N5QLR.js
similarity index 91%
rename from docs/assets/zh-CN_element_info.md.Bx5o2UrA.js
rename to docs/assets/zh-CN_element_info.md.9W7N5QLR.js
index 1af1525..d8a2012 100644
--- a/docs/assets/zh-CN_element_info.md.Bx5o2UrA.js
+++ b/docs/assets/zh-CN_element_info.md.9W7N5QLR.js
@@ -10,12 +10,12 @@ import{_ as s,c as i,o as a,a1 as t,j as n}from"./chunks/framework.DVk8Vg-1.js";
   detail: any; // 不同元素的描述内容不一样
   // operations 为元素操控配置
   operations?: {
-    lock?: boolean;
+    locked?: boolean;
     invisible?: boolean;
     limitRatio?: boolean;
   };
   extension?: { [key: string]: any } | any;
-};

元素的基本属性 ​

属性说明类型默认值备注
type元素类型text| rect|circle|image|svg| html--
uuid唯一 IDstring-iDraw.js 内部会自动添加
name名称string--
xX 轴偏移量number--
yY 轴偏移量number--
w元素宽度number--
h元素高度number--
angle元素旋转角度number0[0, 360]
detail元素描述内容object (详情请查看各元素描述内容)--
operations.lock元素是否锁住booleanfalse元素锁住后就不能进行视图操作
operations.invisible元素是否不可见booleanfalse元素不可见就不会渲染
operations.limitRatio元素是否限制宽高比例boolean-在元素缩放时候，按照其宽高比例进行缩放

画图元素的使用 ​

js
import { iDraw } from 'idraw';
+};

元素的基本属性 ​

属性说明类型默认值备注
type元素类型text| rect|circle|image|svg| html--
uuid唯一 IDstring-iDraw.js 内部会自动添加
name名称string--
xX 轴偏移量number--
yY 轴偏移量number--
w元素宽度number--
h元素高度number--
angle元素旋转角度number0[0, 360]
detail元素描述内容object (详情请查看各元素描述内容)--
operations.locked元素是否锁住booleanfalse元素锁住后就不能进行视图操作
operations.invisible元素是否不可见booleanfalse元素不可见就不会渲染
operations.limitRatio元素是否限制宽高比例boolean-在元素缩放时候，按照其宽高比例进行缩放

画图元素的使用 ​

js
import { iDraw } from 'idraw';
 
 import { iDraw } from 'idraw';
 const data = {
diff --git a/docs/assets/zh-CN_element_info.md.Bx5o2UrA.lean.js b/docs/assets/zh-CN_element_info.md.9W7N5QLR.lean.js
similarity index 100%
rename from docs/assets/zh-CN_element_info.md.Bx5o2UrA.lean.js
rename to docs/assets/zh-CN_element_info.md.9W7N5QLR.lean.js
diff --git a/docs/en-US/api/add-element.html b/docs/en-US/api/add-element.html
index 33de7c6..8b11955 100644
--- a/docs/en-US/api/add-element.html
+++ b/docs/en-US/api/add-element.html
@@ -42,7 +42,7 @@
     borderColor: '#ff6032'
   }
 });

Example ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/api/center-content.html b/docs/en-US/api/center-content.html index 27df44f..293c475 100644 --- a/docs/en-US/api/center-content.html +++ b/docs/en-US/api/center-content.html @@ -33,7 +33,7 @@ }); idraw.centerContent();

Example ​

More Demo

- + \ No newline at end of file diff --git a/docs/en-US/api/delete-element.html b/docs/en-US/api/delete-element.html index cfea6b7..caa21e4 100644 --- a/docs/en-US/api/delete-element.html +++ b/docs/en-US/api/delete-element.html @@ -36,7 +36,7 @@ const uuid = idraw.getData().elements[0].uuid; idraw.deleteElement(uuid);

示例 ​

Example ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/api/enable-disable.html b/docs/en-US/api/enable-disable.html index 30531d6..2252b02 100644 --- a/docs/en-US/api/enable-disable.html +++ b/docs/en-US/api/enable-disable.html @@ -32,7 +32,7 @@ setTimeout(() => { idraw.enable('ruler'); }, 1000);

Example ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/api/get-data.html b/docs/en-US/api/get-data.html index 7d3bea5..31fe787 100644 --- a/docs/en-US/api/get-data.html +++ b/docs/en-US/api/get-data.html @@ -50,7 +50,7 @@ const resultData = idraw.getData(); console.log(resultData);

Example ​

More Demo

- + \ No newline at end of file diff --git a/docs/en-US/api/get-image-blob-url.html b/docs/en-US/api/get-image-blob-url.html index 4e47e07..b6f93de 100644 --- a/docs/en-US/api/get-image-blob-url.html +++ b/docs/en-US/api/get-image-blob-url.html @@ -28,7 +28,7 @@ const idraw = new iDraw(app, options); const { blobURL } = await idraw.getImageBlobURL({ devicePixelRatio: 1 });

Example ​

More Demo

- + \ No newline at end of file diff --git a/docs/en-US/api/move-element.html b/docs/en-US/api/move-element.html index 41d9310..d071926 100644 --- a/docs/en-US/api/move-element.html +++ b/docs/en-US/api/move-element.html @@ -36,7 +36,7 @@ const uuid = idraw.getData().elements[0].uuid; idraw.moveElement(uuid, { position: [1, 2] });

Example ​

More Demo

- + \ No newline at end of file diff --git a/docs/en-US/api/resize.html b/docs/en-US/api/resize.html index f885049..866def5 100644 --- a/docs/en-US/api/resize.html +++ b/docs/en-US/api/resize.html @@ -37,7 +37,7 @@ height: 200, devicePixelRatio: 2 });

Example ​

More Demo

- + \ No newline at end of file diff --git a/docs/en-US/api/select-element.html b/docs/en-US/api/select-element.html index 7b04223..e981d6b 100644 --- a/docs/en-US/api/select-element.html +++ b/docs/en-US/api/select-element.html @@ -35,7 +35,7 @@ const resultData = idraw.getData(); idraw.selectElement(resultData.elements[0].uuid);

Example ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/api/set-data.html b/docs/en-US/api/set-data.html index fca1190..f7be6a5 100644 --- a/docs/en-US/api/set-data.html +++ b/docs/en-US/api/set-data.html @@ -46,7 +46,7 @@ ] }; idraw.setData(data);

Example ​

More Demo

- + \ No newline at end of file diff --git a/docs/en-US/api/set-mode.html b/docs/en-US/api/set-mode.html index 29faed0..3b147af 100644 --- a/docs/en-US/api/set-mode.html +++ b/docs/en-US/api/set-mode.html @@ -27,7 +27,7 @@ }; const idraw = new iDraw(app, options); idraw.setMode('readOnly');

Example ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/api/update-element.html b/docs/en-US/api/update-element.html index 9a63459..faffb25 100644 --- a/docs/en-US/api/update-element.html +++ b/docs/en-US/api/update-element.html @@ -39,7 +39,7 @@ elem.detail.color = '#f0f0f0'; idraw.updateData(elem);

Example ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/circle.html b/docs/en-US/element/circle.html index cc6935b..a04edf6 100644 --- a/docs/en-US/element/circle.html +++ b/docs/en-US/element/circle.html @@ -50,7 +50,7 @@ borderColor: '#3f51b5' } };

Demo Preview ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/group.html b/docs/en-US/element/group.html index 529a4c1..84731d9 100644 --- a/docs/en-US/element/group.html +++ b/docs/en-US/element/group.html @@ -49,7 +49,7 @@ children: [] } };

Demo Preview ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/html.html b/docs/en-US/element/html.html index 0626e4f..7819dbd 100644 --- a/docs/en-US/element/html.html +++ b/docs/en-US/element/html.html @@ -86,7 +86,7 @@ ` } };

Demo Preview ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/image.html b/docs/en-US/element/image.html index 5f91217..e472fbd 100644 --- a/docs/en-US/element/image.html +++ b/docs/en-US/element/image.html @@ -41,7 +41,7 @@ src: './image/github.png' } };

Demo Preview ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/info.html b/docs/en-US/element/info.html index a8584c6..679a0ad 100644 --- a/docs/en-US/element/info.html +++ b/docs/en-US/element/info.html @@ -12,7 +12,7 @@ - + @@ -28,12 +28,12 @@ angle?: number; detail: any; // Different element has different description operations?: { - lock?: boolean; + locked?: boolean; invisible?: boolean; limitRatio?: boolean; }; extension?: { [key: string]: any } | any; -};

Element Basic Properties ​

PropertyDescriptionTypeDefaultRequiredOthers
typeElement typetext| rect| circle| image| svg | html-true-
uuidElement unique IDstring-falseThe UUID is automatically added internally in iDraw.js
nameElement namestring-false-
xX-axis offsetnumber-true-
yY-axis offsetnumber-true-
wElement widthnumber-true-
hElement heightnumber-true-
angleElement rotation anglenumber0false[0, 360]
lockSet the lock-staus of elementbooleanfalsefalseThe view operation cannot be controlled after the element is locked
detailDetail of different elementsobject (Please check the description of each element for details)-true-
operation.lockSet the lock-staus of elementbooleanfalsefalseThe view operation cannot be controlled after the element is locked
operation.invisible-booleanfalsefalse-
operation.limitRatioLimit element width and height ratioboolean-falseWhen the element is scaled, it is scaled according to its width and height ratio

Usage of Elements ​

js
import { iDraw } from 'idraw';
+};

Element Basic Properties ​

PropertyDescriptionTypeDefaultRequiredOthers
typeElement typetext| rect| circle| image| svg | html-true-
uuidElement unique IDstring-falseThe UUID is automatically added internally in iDraw.js
nameElement namestring-false-
xX-axis offsetnumber-true-
yY-axis offsetnumber-true-
wElement widthnumber-true-
hElement heightnumber-true-
angleElement rotation anglenumber0false[0, 360]
lockedSet the lock-staus of elementbooleanfalsefalseThe view operation cannot be controlled after the element is locked
detailDetail of different elementsobject (Please check the description of each element for details)-true-
operation.lockedSet the locked-staus of elementbooleanfalsefalseThe view operation cannot be controlled after the element is locked
operation.invisible-booleanfalsefalse-
operation.limitRatioLimit element width and height ratioboolean-falseWhen the element is scaled, it is scaled according to its width and height ratio

Usage of Elements ​

js
import { iDraw } from 'idraw';
 
 import { iDraw } from 'idraw';
 const data = {
@@ -68,7 +68,7 @@
 
 // Set drawing-data for rendering view
 idraw.setData(data);

Demo Preview ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/path.html b/docs/en-US/element/path.html index cf4a8d3..06613d8 100644 --- a/docs/en-US/element/path.html +++ b/docs/en-US/element/path.html @@ -77,7 +77,7 @@ originW: 80 } };

Demo Preview ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/rect.html b/docs/en-US/element/rect.html index 4a57a2d..20bac6a 100644 --- a/docs/en-US/element/rect.html +++ b/docs/en-US/element/rect.html @@ -50,7 +50,7 @@ borderColor: '#3f51b5' } };

Demo Preview ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/svg.html b/docs/en-US/element/svg.html index 6759757..43abf3f 100644 --- a/docs/en-US/element/svg.html +++ b/docs/en-US/element/svg.html @@ -41,7 +41,7 @@ svg: `<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="400" height="400"><path d="M512 1013.76c-277.11488 0-501.76-224.64512-501.76-501.76S234.88512 10.24 512 10.24s501.76 224.64512 501.76 501.76-224.64512 501.76-501.76 501.76z m0-51.02592c248.9344 0 450.73408-201.79968 450.73408-450.73408 0-248.9344-201.79968-450.73408-450.73408-450.73408-248.9344 0-450.73408 201.79968-450.73408 450.73408 0 248.9344 201.79968 450.73408 450.73408 450.73408zM456.9856 637.9008l295.45984-339.94752a26.4192 26.4192 0 0 1 37.59616-2.31936 28.32896 28.32896 0 0 1 3.10784 38.8608l-307.01568 380.38016a30.72 30.72 0 0 1-42.90048 4.84864L235.44832 556.2368a32.128 32.128 0 0 1-5.74976-44.6464 32.1536 32.1536 0 0 1 44.544-6.58944l182.74304 132.90496z" fill="#1890ff"></path></svg>` } };

Demo Preview ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/element/text.html b/docs/en-US/element/text.html index 340f60d..21324f5 100644 --- a/docs/en-US/element/text.html +++ b/docs/en-US/element/text.html @@ -58,7 +58,7 @@ borderColor: '#3f51b5' } };

Demo Preview ​

More Demo

- + \ No newline at end of file diff --git a/docs/en-US/guide/class-idraw.html b/docs/en-US/guide/class-idraw.html index cde1126..06e9016 100644 --- a/docs/en-US/guide/class-idraw.html +++ b/docs/en-US/guide/class-idraw.html @@ -30,7 +30,7 @@ height: number; devicePixelRatio: number; };

Options Properties ​

PropertyDescriptionTypeDefaultRequiredOthers
widthDrawing board's widthnumber-true-
heightDrawing board's heightnumber-true-
devicePixelRatioDevice pixel scalenumber1false-

Options Preivew ​

More Demo >>

- + \ No newline at end of file diff --git a/docs/en-US/guide/installation.html b/docs/en-US/guide/installation.html index 023d1f1..face426 100644 --- a/docs/en-US/guide/installation.html +++ b/docs/en-US/guide/installation.html @@ -29,7 +29,7 @@ }); })(); </script>

Download and Self Host ​

If you want to avoid using build tools but can't use CDN in production then you can download the relevant .js file and host it using your own web server. You can include it using a <script> tag, just like with the CDN approach.

The files can be browsed and download from a CDN such as unpkg .

- + \ No newline at end of file diff --git a/docs/en-US/guide/introduction.html b/docs/en-US/guide/introduction.html index b705cd1..5da8cfc 100644 --- a/docs/en-US/guide/introduction.html +++ b/docs/en-US/guide/introduction.html @@ -47,7 +47,7 @@ devicePixelRatio: 2 }); idraw.setData(data); - + \ No newline at end of file diff --git a/docs/en-US/guide/quickstart.html b/docs/en-US/guide/quickstart.html index 2e4cfbb..08c959e 100644 --- a/docs/en-US/guide/quickstart.html +++ b/docs/en-US/guide/quickstart.html @@ -47,7 +47,7 @@ // Setting data idraw.setData(data);

Now, we can start the tutorials for using iDraw.js. O(∩_∩)O~

- + \ No newline at end of file diff --git a/docs/en-US/index.html b/docs/en-US/index.html index 8988dc9..bed3a6b 100644 --- a/docs/en-US/index.html +++ b/docs/en-US/index.html @@ -18,7 +18,7 @@
iDraw.js

English

中文

English

中文

Appearance

iDraw.js

Drawing easier on the web.

A simple JavaScript framework for Drawing on the web.

Quick Started
Playground
iDraw Studio

High web compatibility

All based on Canvas 2D API drawing

Extremely simple way to use

There are no complicated operations, only a few simple APIs for drawing operations

Data-Driven drawing

Rely on data to control drawing operations

- + \ No newline at end of file diff --git a/docs/en-US/sponsor.html b/docs/en-US/sponsor.html index 0d0d254..c80c75e 100644 --- a/docs/en-US/sponsor.html +++ b/docs/en-US/sponsor.html @@ -18,7 +18,7 @@
iDraw.js

English

中文

English

中文

Appearance

Become an iDraw.js Sponsor ​

iDraw.js is an MIT licensed open source project and completely free to use. The tremendous amount of effort needed to maintain this framework and develop new features for the project is only made sustainable thanks to the generous financial backing of our sponsors.

How to Sponsor ​

Sponsorships can be done via

Both monthly-recurring sponsorships and one-time donations are accepted. Recurring sponsorships are entitled to logo placements as specified in Sponsorship Tiers.

- + \ No newline at end of file diff --git a/docs/hashmap.json b/docs/hashmap.json index 412b871..8e815df 100644 --- a/docs/hashmap.json +++ b/docs/hashmap.json @@ -1 +1 @@ -{"en-us_api_delete-element.md":"ANUKagkZ","en-us_api_add-element.md":"BEwyne3p","en-us_api_enable-disable.md":"B4Z28AX1","en-us_api_get-data.md":"DNE95Ljg","en-us_api_update-element.md":"eR6Q3nu7","en-us_api_select-element.md":"DcBpcLsl","en-us_api_move-element.md":"D-GYa6q6","en-us_element_circle.md":"BPk9feZm","en-us_element_group.md":"Su27caqc","en-us_api_get-image-blob-url.md":"OMUlBHLq","en-us_api_center-content.md":"BOGHnqJ5","en-us_api_set-mode.md":"UI9pHMSa","en-us_api_resize.md":"DigcBKAH","en-us_element_image.md":"Dk1JHajd","en-us_api_set-data.md":"DMA18cRs","en-us_element_info.md":"CXzazgBf","en-us_element_html.md":"CzQuvGA_","en-us_element_path.md":"Db-xB9cN","en-us_element_rect.md":"BEfc4rId","en-us_element_svg.md":"0YiOqt4z","zh-cn_api_update-element.md":"B3atZaxl","zh-cn_element_svg.md":"BZmDDbGX","en-us_index.md":"HlhUVoF9","index.md":"omXNPcHS","en-us_sponsor.md":"CpYJzvDl","zh-cn_element_group.md":"BOoVjFj6","zh-cn_element_circle.md":"DN6S-EXU","zh-cn_api_add-element.md":"C4ZJ4xPn","zh-cn_api_center-content.md":"Dl8fKLa0","zh-cn_element_image.md":"ByVhe77K","zh-cn_element_html.md":"SdT9eFgT","en-us_guide_quickstart.md":"D2jRO3nK","zh-cn_element_rect.md":"tvEil78x","zh-cn_element_text.md":"CFu3A5yw","zh-cn_guide_installation.md":"DSwwhAVH","zh-cn_guide_class-idraw.md":"7Ne7bKkG","zh-cn_guide_introduction.md":"DCa0dubh","zh-cn_guide_quickstart.md":"pNjsNpVL","zh-cn_index.md":"CJ_7nR73","zh-cn_sponsor.md":"CSFR7EZY","zh-cn_api_set-mode.md":"OQV2zwM7","zh-cn_api_resize.md":"CXioKRUY","zh-cn_api_get-image-blob-url.md":"C9T4Eagc","zh-cn_api_set-data.md":"DrJnKgnY","en-us_guide_class-idraw.md":"DHp7Sg01","zh-cn_api_move-element.md":"DpAyahyc","zh-cn_api_enable-disable.md":"DWNcaloO","en-us_element_text.md":"Cs7GV-AS","zh-cn_api_get-data.md":"DqveOB1M","zh-cn_element_info.md":"Bx5o2UrA","en-us_guide_installation.md":"DqTmXbVu","zh-cn_api_delete-element.md":"DnCEuVI9","zh-cn_element_path.md":"Cez2ZCjd","zh-cn_api_select-element.md":"BHZAppH4","en-us_guide_introduction.md":"CNANOaDX"} +{"en-us_api_center-content.md":"BOGHnqJ5","en-us_api_add-element.md":"BEwyne3p","en-us_api_delete-element.md":"ANUKagkZ","en-us_api_enable-disable.md":"B4Z28AX1","en-us_api_get-data.md":"DNE95Ljg","en-us_api_move-element.md":"D-GYa6q6","en-us_api_resize.md":"DigcBKAH","en-us_api_select-element.md":"DcBpcLsl","en-us_api_set-data.md":"DMA18cRs","en-us_api_set-mode.md":"UI9pHMSa","en-us_api_get-image-blob-url.md":"OMUlBHLq","en-us_element_circle.md":"BPk9feZm","en-us_element_group.md":"Su27caqc","en-us_api_update-element.md":"eR6Q3nu7","en-us_element_image.md":"Dk1JHajd","en-us_element_html.md":"CzQuvGA_","en-us_element_info.md":"DNekkoUZ","en-us_element_rect.md":"BEfc4rId","en-us_element_svg.md":"0YiOqt4z","en-us_guide_installation.md":"DqTmXbVu","en-us_sponsor.md":"CpYJzvDl","en-us_element_path.md":"Db-xB9cN","index.md":"omXNPcHS","en-us_index.md":"HlhUVoF9","en-us_element_text.md":"Cs7GV-AS","en-us_guide_quickstart.md":"D2jRO3nK","en-us_guide_class-idraw.md":"DHp7Sg01","zh-cn_element_text.md":"CFu3A5yw","zh-cn_api_delete-element.md":"DnCEuVI9","zh-cn_api_enable-disable.md":"DWNcaloO","zh-cn_api_get-data.md":"DqveOB1M","zh-cn_api_select-element.md":"BHZAppH4","zh-cn_element_group.md":"BOoVjFj6","zh-cn_element_image.md":"ByVhe77K","zh-cn_guide_class-idraw.md":"7Ne7bKkG","zh-cn_element_info.md":"9W7N5QLR","zh-cn_element_path.md":"Cez2ZCjd","zh-cn_guide_introduction.md":"DCa0dubh","en-us_guide_introduction.md":"CNANOaDX","zh-cn_api_update-element.md":"B3atZaxl","zh-cn_element_html.md":"SdT9eFgT","zh-cn_api_add-element.md":"C4ZJ4xPn","zh-cn_index.md":"CJ_7nR73","zh-cn_sponsor.md":"CSFR7EZY","zh-cn_element_svg.md":"BZmDDbGX","zh-cn_api_resize.md":"CXioKRUY","zh-cn_api_set-data.md":"DrJnKgnY","zh-cn_api_move-element.md":"DpAyahyc","zh-cn_api_center-content.md":"Dl8fKLa0","zh-cn_api_set-mode.md":"OQV2zwM7","zh-cn_element_rect.md":"tvEil78x","zh-cn_element_circle.md":"DN6S-EXU","zh-cn_api_get-image-blob-url.md":"C9T4Eagc","zh-cn_guide_installation.md":"DSwwhAVH","zh-cn_guide_quickstart.md":"pNjsNpVL"} diff --git a/docs/index.html b/docs/index.html index cebd929..e6516d4 100644 --- a/docs/index.html +++ b/docs/index.html @@ -18,7 +18,7 @@
iDraw.js

Appearance

iDraw.js

Drawing easier on the web.

A simple JavaScript framework for Drawing on the web.

Quick Started
中文文档
iDraw Studio

High web compatibility

All based on Canvas 2D API drawing

Extremely simple way to use

There are no complicated operations, only a few simple APIs for drawing operations

Data-Driven drawing

Rely on data to control drawing operations

- + \ No newline at end of file diff --git a/docs/zh-CN/api/add-element.html b/docs/zh-CN/api/add-element.html index 4a5ec56..9620857 100644 --- a/docs/zh-CN/api/add-element.html +++ b/docs/zh-CN/api/add-element.html @@ -42,7 +42,7 @@ borderColor: '#ff6032' } });

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/center-content.html b/docs/zh-CN/api/center-content.html index d861a31..370f69e 100644 --- a/docs/zh-CN/api/center-content.html +++ b/docs/zh-CN/api/center-content.html @@ -33,7 +33,7 @@ }); idraw.centerContent();

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/delete-element.html b/docs/zh-CN/api/delete-element.html index 80c5ff2..dd42987 100644 --- a/docs/zh-CN/api/delete-element.html +++ b/docs/zh-CN/api/delete-element.html @@ -36,7 +36,7 @@ const uuid = idraw.getData().elements[0].uuid; idraw.deleteElement(uuid);

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/enable-disable.html b/docs/zh-CN/api/enable-disable.html index e5599cb..f4138d4 100644 --- a/docs/zh-CN/api/enable-disable.html +++ b/docs/zh-CN/api/enable-disable.html @@ -32,7 +32,7 @@ setTimeout(() => { idraw.enable('ruler'); }, 1000);

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/get-data.html b/docs/zh-CN/api/get-data.html index 074e55b..5600ade 100644 --- a/docs/zh-CN/api/get-data.html +++ b/docs/zh-CN/api/get-data.html @@ -50,7 +50,7 @@ const resultData = idraw.getData(); console.log(resultData);

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/get-image-blob-url.html b/docs/zh-CN/api/get-image-blob-url.html index a7ee156..0270959 100644 --- a/docs/zh-CN/api/get-image-blob-url.html +++ b/docs/zh-CN/api/get-image-blob-url.html @@ -28,7 +28,7 @@ const idraw = new iDraw(app, options); const { blobURL } = await idraw.getImageBlobURL({ devicePixelRatio: 1 });

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/move-element.html b/docs/zh-CN/api/move-element.html index 5da373f..48faf96 100644 --- a/docs/zh-CN/api/move-element.html +++ b/docs/zh-CN/api/move-element.html @@ -36,7 +36,7 @@ const uuid = idraw.getData().elements[0].uuid; idraw.moveElement(uuid, { position: [1, 2] });

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/resize.html b/docs/zh-CN/api/resize.html index 0c1af5a..f3c9b36 100644 --- a/docs/zh-CN/api/resize.html +++ b/docs/zh-CN/api/resize.html @@ -37,7 +37,7 @@ height: 200, devicePixelRatio: 2 });

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/select-element.html b/docs/zh-CN/api/select-element.html index f14fc56..a4e025c 100644 --- a/docs/zh-CN/api/select-element.html +++ b/docs/zh-CN/api/select-element.html @@ -35,7 +35,7 @@ const resultData = idraw.getData(); idraw.selectElement(resultData.elements[0].uuid);

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/set-data.html b/docs/zh-CN/api/set-data.html index dba8fea..8e0548f 100644 --- a/docs/zh-CN/api/set-data.html +++ b/docs/zh-CN/api/set-data.html @@ -46,7 +46,7 @@ ] }; idraw.setData(data);

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/set-mode.html b/docs/zh-CN/api/set-mode.html index b4c44a3..805a77b 100644 --- a/docs/zh-CN/api/set-mode.html +++ b/docs/zh-CN/api/set-mode.html @@ -27,7 +27,7 @@ }; const idraw = new iDraw(app, options); idraw.setMode('readOnly');

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/api/update-element.html b/docs/zh-CN/api/update-element.html index a13a623..4b42095 100644 --- a/docs/zh-CN/api/update-element.html +++ b/docs/zh-CN/api/update-element.html @@ -39,7 +39,7 @@ elem.detail.color = '#f0f0f0'; idraw.updateData(elem);

示例 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/circle.html b/docs/zh-CN/element/circle.html index 316d131..ff5febe 100644 --- a/docs/zh-CN/element/circle.html +++ b/docs/zh-CN/element/circle.html @@ -50,7 +50,7 @@ borderColor: '#3f51b5' } };

效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/group.html b/docs/zh-CN/element/group.html index 333389b..c2bac77 100644 --- a/docs/zh-CN/element/group.html +++ b/docs/zh-CN/element/group.html @@ -49,7 +49,7 @@ children: [] } };

效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/html.html b/docs/zh-CN/element/html.html index 396263d..7e0d427 100644 --- a/docs/zh-CN/element/html.html +++ b/docs/zh-CN/element/html.html @@ -86,7 +86,7 @@ ` } };

效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/image.html b/docs/zh-CN/element/image.html index 4506b30..21c04e5 100644 --- a/docs/zh-CN/element/image.html +++ b/docs/zh-CN/element/image.html @@ -41,7 +41,7 @@ src: './image/github.png' } };

效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/info.html b/docs/zh-CN/element/info.html index 0b8b834..f0a4319 100644 --- a/docs/zh-CN/element/info.html +++ b/docs/zh-CN/element/info.html @@ -12,7 +12,7 @@ - + @@ -29,12 +29,12 @@ detail: any; // 不同元素的描述内容不一样 // operations 为元素操控配置 operations?: { - lock?: boolean; + locked?: boolean; invisible?: boolean; limitRatio?: boolean; }; extension?: { [key: string]: any } | any; -};

元素的基本属性 ​

属性说明类型默认值备注
type元素类型text| rect|circle|image|svg| html--
uuid唯一 IDstring-iDraw.js 内部会自动添加
name名称string--
xX 轴偏移量number--
yY 轴偏移量number--
w元素宽度number--
h元素高度number--
angle元素旋转角度number0[0, 360]
detail元素描述内容object (详情请查看各元素描述内容)--
operations.lock元素是否锁住booleanfalse元素锁住后就不能进行视图操作
operations.invisible元素是否不可见booleanfalse元素不可见就不会渲染
operations.limitRatio元素是否限制宽高比例boolean-在元素缩放时候，按照其宽高比例进行缩放

画图元素的使用 ​

js
import { iDraw } from 'idraw';
+};

元素的基本属性 ​

属性说明类型默认值备注
type元素类型text| rect|circle|image|svg| html--
uuid唯一 IDstring-iDraw.js 内部会自动添加
name名称string--
xX 轴偏移量number--
yY 轴偏移量number--
w元素宽度number--
h元素高度number--
angle元素旋转角度number0[0, 360]
detail元素描述内容object (详情请查看各元素描述内容)--
operations.locked元素是否锁住booleanfalse元素锁住后就不能进行视图操作
operations.invisible元素是否不可见booleanfalse元素不可见就不会渲染
operations.limitRatio元素是否限制宽高比例boolean-在元素缩放时候，按照其宽高比例进行缩放

画图元素的使用 ​

js
import { iDraw } from 'idraw';
 
 import { iDraw } from 'idraw';
 const data = {
@@ -69,7 +69,7 @@
 
 // 设置元素数据，渲染画图内容
 idraw.setData(data);

示例预览 ​

Demo 完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/path.html b/docs/zh-CN/element/path.html index 64ec33a..c8192a3 100644 --- a/docs/zh-CN/element/path.html +++ b/docs/zh-CN/element/path.html @@ -77,7 +77,7 @@ originW: 80 } };

效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/rect.html b/docs/zh-CN/element/rect.html index bcada26..7563c7f 100644 --- a/docs/zh-CN/element/rect.html +++ b/docs/zh-CN/element/rect.html @@ -50,7 +50,7 @@ borderColor: '#3f51b5' } };

效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/svg.html b/docs/zh-CN/element/svg.html index fc3e510..ba445db 100644 --- a/docs/zh-CN/element/svg.html +++ b/docs/zh-CN/element/svg.html @@ -41,7 +41,7 @@ svg: `<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="400" height="400"><path d="M512 1013.76c-277.11488 0-501.76-224.64512-501.76-501.76S234.88512 10.24 512 10.24s501.76 224.64512 501.76 501.76-224.64512 501.76-501.76 501.76z m0-51.02592c248.9344 0 450.73408-201.79968 450.73408-450.73408 0-248.9344-201.79968-450.73408-450.73408-450.73408-248.9344 0-450.73408 201.79968-450.73408 450.73408 0 248.9344 201.79968 450.73408 450.73408 450.73408zM456.9856 637.9008l295.45984-339.94752a26.4192 26.4192 0 0 1 37.59616-2.31936 28.32896 28.32896 0 0 1 3.10784 38.8608l-307.01568 380.38016a30.72 30.72 0 0 1-42.90048 4.84864L235.44832 556.2368a32.128 32.128 0 0 1-5.74976-44.6464 32.1536 32.1536 0 0 1 44.544-6.58944l182.74304 132.90496z" fill="#1890ff"></path></svg>` } };

效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/element/text.html b/docs/zh-CN/element/text.html index 2e451cd..f67a73f 100644 --- a/docs/zh-CN/element/text.html +++ b/docs/zh-CN/element/text.html @@ -59,7 +59,7 @@ borderColor: '#3f51b5' } };

效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/guide/class-idraw.html b/docs/zh-CN/guide/class-idraw.html index 914f41b..1389e62 100644 --- a/docs/zh-CN/guide/class-idraw.html +++ b/docs/zh-CN/guide/class-idraw.html @@ -30,7 +30,7 @@ height: number; devicePixelRatio: number; };

Options 属性 ​

属性说明类型默认值是否必填备注
width画板宽度number-true-
height画板高度number-true-
devicePixelRatio设备像素比例number1false-

Options 效果预览 ​

Demo完整预览 Playground >>

- + \ No newline at end of file diff --git a/docs/zh-CN/guide/installation.html b/docs/zh-CN/guide/installation.html index 70b7cbe..fce2dd4 100644 --- a/docs/zh-CN/guide/installation.html +++ b/docs/zh-CN/guide/installation.html @@ -29,7 +29,7 @@ }); })(); </script>

WARNING

不建议用 unpkg.com 站点的CDN资源的放在生产环境

自托管JavaScript文件 ​

如果不想使用构建工具，同时无法直接使用 CDN方式 调用，那么可以将相关的 .js 文件下载到项目本地或者服务器上托管。最后通过 <script> 方式引用，使用方法跟 CDN 的方式类似。

具体的 JavaScript文件 可以从 unpkg 这里下载最新的 iDraw.js 文件。

- + \ No newline at end of file diff --git a/docs/zh-CN/guide/introduction.html b/docs/zh-CN/guide/introduction.html index 14aeb69..d41602c 100644 --- a/docs/zh-CN/guide/introduction.html +++ b/docs/zh-CN/guide/introduction.html @@ -47,7 +47,7 @@ devicePixelRatio: 2 }); idraw.setData(data); - + \ No newline at end of file diff --git a/docs/zh-CN/guide/quickstart.html b/docs/zh-CN/guide/quickstart.html index a290660..07c5ab3 100644 --- a/docs/zh-CN/guide/quickstart.html +++ b/docs/zh-CN/guide/quickstart.html @@ -47,7 +47,7 @@ // 设置数据 idraw.setData(data);

至此，小伙伴们就可以愉快的开启 iDraw.js 的画图之旅啦！O(∩_∩)O~

- + \ No newline at end of file diff --git a/docs/zh-CN/index.html b/docs/zh-CN/index.html index 61b190a..157f3da 100644 --- a/docs/zh-CN/index.html +++ b/docs/zh-CN/index.html @@ -18,7 +18,7 @@
iDraw.js

中文

English

中文

English

Appearance

iDraw.js

让Web绘图更加简单.

一个面向Web绘图的JavaScript框架

快速开始
演示
产品 iDraw Studio

高兼容性

目前基于Canvas 2D API实现，能适应绝大部分主流浏览器。

用法简单

没有复杂的使用方式，只有简单的几个API来操作Web绘图。

数据驱动绘制

依赖数据来驱动图画的绘制

- + \ No newline at end of file diff --git a/docs/zh-CN/sponsor.html b/docs/zh-CN/sponsor.html index 1c97cfd..e45ac09 100644 --- a/docs/zh-CN/sponsor.html +++ b/docs/zh-CN/sponsor.html @@ -18,7 +18,7 @@
iDraw.js

中文

English

中文

English

Appearance

Become an iDraw.js Sponsor ​

iDraw.js is an MIT licensed open source project and completely free to use. The tremendous amount of effort needed to maintain this framework and develop new features for the project is only made sustainable thanks to the generous financial backing of our sponsors.

How to Sponsor ​

Sponsorships can be done via

Both monthly-recurring sponsorships and one-time donations are accepted. Recurring sponsorships are entitled to logo placements as specified in Sponsorship Tiers.

- + \ No newline at end of file