vislite 1.12.0-alpha.0 → 1.12.0

package/package/index.ts

@@ -1,85 +1,85 @@
-import Cardinal from "./Cardinal/index"
-import Hermite from "./Hermite/index"
-
-import Matrix4 from "./Matrix4/index"
-import rotate from "./rotate/index"
-import move from "./move/index"
-import scale from "./scale/index"
-
-import getLoopColors from "./getLoopColors/index"
-import animation from "./animation/index"
-import ruler from "./ruler/index"
-
-import SVG from "./SVG/index"
-import Canvas from "./Canvas/index"
-import RawCanvas from "../src/common/canvas/index"
-
-import getWebGLContext from "./getWebGLContext/index"
-import Shader from "./Shader/index"
-import Texture from "./Texture/index"
-import Buffer from "./Buffer/index"
-
-import Eoap from "./Eoap/index"
-import Mercator from "./Mercator/index"
-
-import throttle from "./throttle/index"
-
-import MapCoordinate from "./MapCoordinate/index"
-
-import TreeLayout from "./TreeLayout/index"
-import PieLayout from "./PieLayout/index"
-import BarLayout from "./BarLayout/index"
-
-import initOption from "./initOption/index"
-import mergeOption from "./mergeOption/index"
-
-import assemble from "./assemble/index"
-
-export default {
-
-    // 插值
-    Cardinal,
-    Hermite,
-
-    // 变换
-    Matrix4,
-    rotate,
-    move,
-    scale,
-
-    // 工具
-    getLoopColors,
-    animation,
-    ruler,
-
-    // 画笔
-    SVG,
-    Canvas,
-    RawCanvas,
-
-    // WebGL
-    getWebGLContext,
-    Shader,
-    Texture,
-    Buffer,
-
-    // 投影
-    Eoap,
-    Mercator,
-
-    // 辅助
-    throttle,
-    assemble,
-
-    // 坐标系
-    MapCoordinate,
-
-    // 布局
-    TreeLayout,
-    PieLayout,
-    BarLayout,
-
-    // 配置项
-    initOption,
-    mergeOption
+import Cardinal from "./Cardinal/index"
+import Hermite from "./Hermite/index"
+
+import Matrix4 from "./Matrix4/index"
+import rotate from "./rotate/index"
+import move from "./move/index"
+import scale from "./scale/index"
+
+import getLoopColors from "./getLoopColors/index"
+import animation from "./animation/index"
+import ruler from "./ruler/index"
+
+import SVG from "./SVG/index"
+import Canvas from "./Canvas/index"
+import RawCanvas from "../src/common/canvas/index"
+
+import getWebGLContext from "./getWebGLContext/index"
+import Shader from "./Shader/index"
+import Texture from "./Texture/index"
+import Buffer from "./Buffer/index"
+
+import Eoap from "./Eoap/index"
+import Mercator from "./Mercator/index"
+
+import throttle from "./throttle/index"
+
+import MapCoordinate from "./MapCoordinate/index"
+
+import TreeLayout from "./TreeLayout/index"
+import PieLayout from "./PieLayout/index"
+import BarLayout from "./BarLayout/index"
+
+import initOption from "./initOption/index"
+import mergeOption from "./mergeOption/index"
+
+import assemble from "./assemble/index"
+
+export default {
+
+    // 插值
+    Cardinal,
+    Hermite,
+
+    // 变换
+    Matrix4,
+    rotate,
+    move,
+    scale,
+
+    // 工具
+    getLoopColors,
+    animation,
+    ruler,
+
+    // 画笔
+    SVG,
+    Canvas,
+    RawCanvas,
+
+    // WebGL
+    getWebGLContext,
+    Shader,
+    Texture,
+    Buffer,
+
+    // 投影
+    Eoap,
+    Mercator,
+
+    // 辅助
+    throttle,
+    assemble,
+
+    // 坐标系
+    MapCoordinate,
+
+    // 布局
+    TreeLayout,
+    PieLayout,
+    BarLayout,
+
+    // 配置项
+    initOption,
+    mergeOption
 }

package/package/initOption/index.ts

@@ -1,3 +1,3 @@
-import { initOption } from "../../src/common/option"
-
+import { initOption } from "../../src/common/option"
+
 export default initOption

package/package/mergeOption/index.ts

@@ -1,3 +1,3 @@
-import { mergeOption } from "../../src/common/option"
-
+import { mergeOption } from "../../src/common/option"
+
 export default mergeOption

package/package/move/index.ts

@@ -1,3 +1,3 @@
-import move from "../../src/move"
-
+import move from "../../src/move"
+
 export default move

package/package/rotate/index.ts

@@ -1,3 +1,3 @@
-import rotate from "../../src/rotate"
-
+import rotate from "../../src/rotate"
+
 export default rotate

package/package/ruler/index.ts

@@ -1,3 +1,3 @@
-import ruler from "../../src/ruler"
-
+import ruler from "../../src/ruler"
+
 export default ruler

package/package/scale/index.ts

@@ -1,3 +1,3 @@
-import scale from "../../src/scale"
-
+import scale from "../../src/scale"
+
 export default scale

package/package/throttle/index.ts

@@ -1,3 +1,3 @@
-import { throttle } from "oipage/web/throttle/index"
-
+import { throttle } from "oipage/web/throttle/index"
+
 export default throttle

package/package.json

@@ -1,79 +1,79 @@
-{
-  "name": "vislite",
-  "version": "1.12.0-alpha.0",
-  "description": "灵活、快速、简单的数据可视化交互式跨端前端库",
-  "main": "./lib/index.umd.min.js",
-  "typings": "./types/index.d.ts",
-  "unpkg": "./lib/index.umd.min.js",
-  "jsdelivr": "./lib/index.umd.min.js",
-  "sideEffects": false,
-  "scripts": {
-    "dev": "webpack serve --config ./build/webpack.config.js",
-    "build": "oipage-cli disk -d ./lib && node ./build/pkg.js",
-    "test": "karma start ./build/karma.config.js",
-    "lint": "eslint src/**/*.ts --fix"
-  },
-  "bin": {
-    "vislite-cli": "bin/run"
-  },
-  "miniprogram": ".",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/oi-contrib/VISLite.git"
-  },
-  "keywords": [
-    "svg",
-    "webgl",
-    "typescript",
-    "canvas",
-    "vue",
-    "uniapp",
-    "miniprogram",
-    "image2d",
-    "image3d",
-    "oi-contrib",
-    "vislite",
-    "d3",
-    "zxl20070701",
-    "three",
-    "echarts",
-    "datav",
-    "webgpu",
-    "layout",
-    "algorithm"
-  ],
-  "author": {
-    "name": "zxl20070701",
-    "url": "https://zxl20070701.github.io/notebook/home.html"
-  },
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/oi-contrib/VISLite/issues"
-  },
-  "homepage": "https://oi-contrib.github.io/VISLite",
-  "devDependencies": {
-    "@oipage/cli": "^0.2.1",
-    "@rollup/plugin-commonjs": "^25.0.7",
-    "@rollup/plugin-node-resolve": "^15.2.3",
-    "@rollup/plugin-typescript": "^11.1.0",
-    "@types/jasmine": "^4.3.1",
-    "@typescript-eslint/eslint-plugin": "^8.62.1",
-    "@typescript-eslint/parser": "^8.62.1",
-    "eslint": "^8.57.0",
-    "karma": "^6.3.10",
-    "karma-chrome-launcher": "^3.1.0",
-    "karma-jasmine": "^4.0.1",
-    "karma-webpack": "^5.0.0",
-    "rollup": "^3.20.6",
-    "terser": "^5.17.1",
-    "ts-loader": "^9.2.8",
-    "tslib": "^2.5.0",
-    "typescript": "^4.6.2",
-    "webpack": "^5.108.0",
-    "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^6.0.0"
-  },
-  "dependencies": {
-    "oipage": "^2.1.0"
-  }
-}
+{
+  "name": "vislite",
+  "version": "1.12.0",
+  "description": "灵活、快速、简单的数据可视化交互式跨端前端库",
+  "main": "./lib/index.umd.min.js",
+  "typings": "./types/index.d.ts",
+  "unpkg": "./lib/index.umd.min.js",
+  "jsdelivr": "./lib/index.umd.min.js",
+  "sideEffects": false,
+  "scripts": {
+    "dev": "webpack serve --config ./build/webpack.config.js",
+    "build": "oipage-cli disk -d ./lib && node ./build/pkg.js",
+    "test": "karma start ./build/karma.config.js",
+    "lint": "eslint src/**/*.ts --fix"
+  },
+  "bin": {
+    "vislite-cli": "bin/run"
+  },
+  "miniprogram": ".",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/oi-contrib/VISLite.git"
+  },
+  "keywords": [
+    "svg",
+    "webgl",
+    "typescript",
+    "canvas",
+    "vue",
+    "uniapp",
+    "miniprogram",
+    "image2d",
+    "image3d",
+    "oi-contrib",
+    "vislite",
+    "d3",
+    "zxl20070701",
+    "three",
+    "echarts",
+    "datav",
+    "webgpu",
+    "layout",
+    "algorithm"
+  ],
+  "author": {
+    "name": "zxl20070701",
+    "url": "https://zxl20070701.github.io/notebook/home.html"
+  },
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/oi-contrib/VISLite/issues"
+  },
+  "homepage": "https://oi-contrib.github.io/VISLite",
+  "devDependencies": {
+    "@oipage/cli": "^0.2.1",
+    "@rollup/plugin-commonjs": "^25.0.7",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-typescript": "^11.1.0",
+    "@types/jasmine": "^4.3.1",
+    "@typescript-eslint/eslint-plugin": "^8.62.1",
+    "@typescript-eslint/parser": "^8.62.1",
+    "eslint": "^8.57.0",
+    "karma": "^6.3.10",
+    "karma-chrome-launcher": "^3.1.0",
+    "karma-jasmine": "^4.0.1",
+    "karma-webpack": "^5.0.0",
+    "rollup": "^3.20.6",
+    "terser": "^5.17.1",
+    "ts-loader": "^9.2.8",
+    "tslib": "^2.5.0",
+    "typescript": "^4.6.2",
+    "webpack": "^5.108.0",
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^6.0.0"
+  },
+  "dependencies": {
+    "oipage": "^2.1.0"
+  }
+}

package/skills/vislite-lib/BarLayout.md

@@ -1,118 +1,118 @@
-# BarLayout 柱状图布局
-
-BarLayout 用于绘制柱状图/条形图。
-
-## 引入
-
-```js
-import { BarLayout } from 'vislite';
-```
-
-## 初始化
-
-```js
-var barLayout = new BarLayout();
-```
-
-## setOption 设置布局行为
-
-```js
-barLayout.setOption({
-    x: 50,              // 左上角x坐标
-    y: 350,             // 左上角y坐标
-    width: 400,         // 宽度
-    height: 300,        // 高度
-    category: 'xAxis',  // 分类轴：xAxis|yAxis
-    duration: 200       // 动画时长(ms)
-});
-```
-
-### category 方向
-
-- **xAxis**: 分类在x轴，柱状图从下往上
-- **yAxis**: 分类在y轴，条形图从左往右
-
-## use 坐标计算
-
-### 一维数据
-
-```js
-var data = {
-    category: ['HTML', 'CSS', 'JS'],
-    data: [30, 20, 50]
-};
-var bar = barLayout.use(data);
-```
-
-### 二维数据（分组柱状图）
-
-```js
-var data = {
-    category: ['HTML', 'CSS', 'JS'],
-    value: [
-        { name: '男生', data: [30, 20, 50] },
-        { name: '女生', data: [25, 30, 40] }
-    ]
-};
-var bar = barLayout.use(data);
-```
-
-### 返回值 bar 结构
-
-```js
-{
-    coordinate: {
-        x, y, width, height,    // 坐标系位置
-        xAxis: { type: 'category' | 'value', data: [...] },
-        yAxis: { type: 'category' | 'value', data: [...] }
-    },
-    node: [
-        {
-            name: '分组名称',     // 分组柱状图时有效
-            bar: [
-                {
-                    x, y, width, height,  // 矩形位置
-                    value: 数值
-                }
-            ]
-        }
-    ]
-}
-```
-
-## 使用示例
-
-```js
-var barLayout = new BarLayout();
-
-barLayout.setOption({
-    x: 50,
-    y: 350,
-    width: 400,
-    height: 300,
-    category: 'xAxis'
-});
-
-var data = {
-    category: ['HTML', 'CSS', 'JavaScript'],
-    data: [30, 20, 50]
-};
-
-var bar = barLayout.use(data);
-
-// 绘制坐标系
-painter.config({ strokeStyle: 'black' })
-    .beginPath()
-    .moveTo(bar.coordinate.x, bar.coordinate.y)
-    .lineTo(bar.coordinate.x + bar.coordinate.width, bar.coordinate.y)
-    .lineTo(bar.coordinate.x + bar.coordinate.width, bar.coordinate.y - bar.coordinate.height)
-    .stroke();
-
-// 绘制柱状图
-var colors = ['red', 'green', 'blue'];
-for (var i = 0; i < bar.node[0].bar.length; i++) {
-    var rect = bar.node[0].bar[i];
-    painter.config({ fillStyle: colors[i] })
-        .fillRect(rect.x, rect.y, rect.width, rect.height);
-}
+# BarLayout 柱状图布局
+
+BarLayout 用于绘制柱状图/条形图。
+
+## 引入
+
+```js
+import { BarLayout } from 'vislite';
+```
+
+## 初始化
+
+```js
+var barLayout = new BarLayout();
+```
+
+## setOption 设置布局行为
+
+```js
+barLayout.setOption({
+    x: 50,              // 左上角x坐标
+    y: 350,             // 左上角y坐标
+    width: 400,         // 宽度
+    height: 300,        // 高度
+    category: 'xAxis',  // 分类轴：xAxis|yAxis
+    duration: 200       // 动画时长(ms)
+});
+```
+
+### category 方向
+
+- **xAxis**: 分类在x轴，柱状图从下往上
+- **yAxis**: 分类在y轴，条形图从左往右
+
+## use 坐标计算
+
+### 一维数据
+
+```js
+var data = {
+    category: ['HTML', 'CSS', 'JS'],
+    data: [30, 20, 50]
+};
+var bar = barLayout.use(data);
+```
+
+### 二维数据（分组柱状图）
+
+```js
+var data = {
+    category: ['HTML', 'CSS', 'JS'],
+    value: [
+        { name: '男生', data: [30, 20, 50] },
+        { name: '女生', data: [25, 30, 40] }
+    ]
+};
+var bar = barLayout.use(data);
+```
+
+### 返回值 bar 结构
+
+```js
+{
+    coordinate: {
+        x, y, width, height,    // 坐标系位置
+        xAxis: { type: 'category' | 'value', data: [...] },
+        yAxis: { type: 'category' | 'value', data: [...] }
+    },
+    node: [
+        {
+            name: '分组名称',     // 分组柱状图时有效
+            bar: [
+                {
+                    x, y, width, height,  // 矩形位置
+                    value: 数值
+                }
+            ]
+        }
+    ]
+}
+```
+
+## 使用示例
+
+```js
+var barLayout = new BarLayout();
+
+barLayout.setOption({
+    x: 50,
+    y: 350,
+    width: 400,
+    height: 300,
+    category: 'xAxis'
+});
+
+var data = {
+    category: ['HTML', 'CSS', 'JavaScript'],
+    data: [30, 20, 50]
+};
+
+var bar = barLayout.use(data);
+
+// 绘制坐标系
+painter.config({ strokeStyle: 'black' })
+    .beginPath()
+    .moveTo(bar.coordinate.x, bar.coordinate.y)
+    .lineTo(bar.coordinate.x + bar.coordinate.width, bar.coordinate.y)
+    .lineTo(bar.coordinate.x + bar.coordinate.width, bar.coordinate.y - bar.coordinate.height)
+    .stroke();
+
+// 绘制柱状图
+var colors = ['red', 'green', 'blue'];
+for (var i = 0; i < bar.node[0].bar.length; i++) {
+    var rect = bar.node[0].bar[i];
+    painter.config({ fillStyle: colors[i] })
+        .fillRect(rect.x, rect.y, rect.width, rect.height);
+}
 ```