@sakuzu/maplibre-gl-draw 1.0.0 → 2.1.0

package/dist/webgl/index.d.ts

@@ -0,0 +1,65 @@
+/**
+ * Write your own shaders that draw the way the library does.
+ *
+ * Use it only when a custom feature type or an overlay needs a shader of its own. The
+ * {@link maplibre-gl-draw!RenderContext | RenderContext} a renderer receives already carries
+ * the shared renderers of lines, areas and point markers, and most renderers need nothing
+ * more. This entry holds the GLSL of the projection, the uniforms that go with it, the quad
+ * shader, and the rules the shared renderers follow for dashes and terrain. The parts that draw
+ * on the terrain take the render context of the draw call (or its `terrain`). Unlike the main
+ * entry, it may change in a minor release.
+ *
+ * ```ts
+ * import {
+ *   createProgram, OFFSET_MODE_GLSL, ProjectionUniformManager,
+ * } from '@sakuzu/maplibre-gl-draw/webgl';
+ *
+ * let program: WebGLProgram | null = null;
+ * let uniforms: ProjectionUniformManager | null = null;
+ * draw.extensions.overlays.add({
+ *   name: 'my-shader',
+ *   onAdd: () => {},
+ *   draw(ctx) {
+ *     if (!program) {
+ *       const vertex = vertexSource(ctx.shader.vertexShaderPrelude, OFFSET_MODE_GLSL);
+ *       program = createProgram(ctx.gl, vertex, fragmentSource);
+ *       uniforms = new ProjectionUniformManager(ctx.gl);
+ *       uniforms.getLocations(program);
+ *     }
+ *     ctx.gl.useProgram(program);
+ *     uniforms?.setTerrain(ctx);
+ *     uniforms?.setUniforms(ctx.projection, ctx.zoom, ctx.offset);
+ *     // bind the buffers of your shape and draw it
+ *   },
+ *   onRemove: (_map, gl) => gl.deleteProgram(program),
+ * });
+ * ```
+ *
+ * Read next: the guide
+ * [custom feature types](https://sakuzu.github.io/maplibre-gl-draw/guides/custom-types). The
+ * parts used most are {@link createProgram}, {@link OFFSET_MODE_GLSL} and
+ * {@link ProjectionUniformManager}.
+ *
+ * @module webgl
+ */
+export { DEFAULT_TILE_SIZE } from '../shared/math/constants.js';
+export { calculateLngLatOffset, createProgram, OFFSET_MODE_GLSL, } from '../view/shaders/helpers.js';
+export { ProjectionUniformManager } from '../view/shaders/projection.js';
+export { applyDrawBlendState } from '../view/layer/blend.js';
+export { drawBillboardsWithoutDepth } from '../view/renderers/point/billboard-depth.js';
+export type { QuadDrapeGlyphs } from '../view/terrain/drape/quad.js';
+export type { QuadVertices } from '../view/shaders/quad.js';
+export { computeQuadVertices, drawQuadSurfaceOnTerrain, QuadShader } from '../view/shaders/quad.js';
+export { QUAD_GLYPH_STRIDE } from '../view/terrain/drape/quad-glyphs.js';
+export type { SDFStrokeOptions, SDFStrokeStyle } from '../view/renderers/line/sdf-line.js';
+export type { WidthUnit } from '../view/renderers/stroke.js';
+export { getStrokeDashPattern as dashPattern, splitIntoDashes, } from '../view/renderers/line/dash.js';
+export { terrainTessellationStep } from '../view/terrain/polygon.js';
+export { densifyPath } from '../view/terrain/tessellation.js';
+export { PointHitTestStrategy } from '../dispatcher/hit-test/strategies/point.js';
+export type { Coordinate } from '../shared/types/model.js';
+export type { BlendCapableGL } from '../view/layer/blend.js';
+export type { DashSegment } from '../view/renderers/line/dash.js';
+export type { ProjectionUniformLocations } from '../view/shaders/projection.js';
+export type { DrapeQuadCorners, QuadDrapeColor, QuadDrapeFill, QuadDrapeSurface, } from '../view/terrain/drape/quad.js';
+export type { MercatorRect, TessellationStep, TessellationTiling, } from '../view/terrain/tessellation.js';

package/dist/webgl/index.js

@@ -0,0 +1,62 @@
+// SPDX-FileCopyrightText: 2026 SAKAIDA Atsushi
+// SPDX-License-Identifier: AGPL-3.0-only
+/**
+ * Write your own shaders that draw the way the library does.
+ *
+ * Use it only when a custom feature type or an overlay needs a shader of its own. The
+ * {@link maplibre-gl-draw!RenderContext | RenderContext} a renderer receives already carries
+ * the shared renderers of lines, areas and point markers, and most renderers need nothing
+ * more. This entry holds the GLSL of the projection, the uniforms that go with it, the quad
+ * shader, and the rules the shared renderers follow for dashes and terrain. The parts that draw
+ * on the terrain take the render context of the draw call (or its `terrain`). Unlike the main
+ * entry, it may change in a minor release.
+ *
+ * ```ts
+ * import {
+ *   createProgram, OFFSET_MODE_GLSL, ProjectionUniformManager,
+ * } from '@sakuzu/maplibre-gl-draw/webgl';
+ *
+ * let program: WebGLProgram | null = null;
+ * let uniforms: ProjectionUniformManager | null = null;
+ * draw.extensions.overlays.add({
+ *   name: 'my-shader',
+ *   onAdd: () => {},
+ *   draw(ctx) {
+ *     if (!program) {
+ *       const vertex = vertexSource(ctx.shader.vertexShaderPrelude, OFFSET_MODE_GLSL);
+ *       program = createProgram(ctx.gl, vertex, fragmentSource);
+ *       uniforms = new ProjectionUniformManager(ctx.gl);
+ *       uniforms.getLocations(program);
+ *     }
+ *     ctx.gl.useProgram(program);
+ *     uniforms?.setTerrain(ctx);
+ *     uniforms?.setUniforms(ctx.projection, ctx.zoom, ctx.offset);
+ *     // bind the buffers of your shape and draw it
+ *   },
+ *   onRemove: (_map, gl) => gl.deleteProgram(program),
+ * });
+ * ```
+ *
+ * Read next: the guide
+ * [custom feature types](https://sakuzu.github.io/maplibre-gl-draw/guides/custom-types). The
+ * parts used most are {@link createProgram}, {@link OFFSET_MODE_GLSL} and
+ * {@link ProjectionUniformManager}.
+ *
+ * @module webgl
+ */
+// biome-ignore-all assist/source/organizeImports: the exports are grouped by section
+// Shaders and projection
+export { DEFAULT_TILE_SIZE } from '../shared/math/constants.js';
+export { calculateLngLatOffset, createProgram, OFFSET_MODE_GLSL, } from '../view/shaders/helpers.js';
+export { ProjectionUniformManager } from '../view/shaders/projection.js';
+// Blending and billboards
+export { applyDrawBlendState } from '../view/layer/blend.js';
+export { drawBillboardsWithoutDepth } from '../view/renderers/point/billboard-depth.js';
+export { computeQuadVertices, drawQuadSurfaceOnTerrain, QuadShader } from '../view/shaders/quad.js';
+export { QUAD_GLYPH_STRIDE } from '../view/terrain/drape/quad-glyphs.js';
+export { getStrokeDashPattern as dashPattern, splitIntoDashes, } from '../view/renderers/line/dash.js';
+// Terrain
+export { terrainTessellationStep } from '../view/terrain/polygon.js';
+export { densifyPath } from '../view/terrain/tessellation.js';
+// Hit testing
+export { PointHitTestStrategy } from '../dispatcher/hit-test/strategies/point.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sakuzu/maplibre-gl-draw",
-  "version": "1.0.0",
+  "version": "2.1.0",
   "description": "WebGL2 drawing and editing engine for MapLibre GL JS: points, lines, and polygons rendered in a custom layer, with selection, hit testing, and geometry utilities.",
   "keywords": [
     "maplibre",
@@ -38,10 +38,15 @@
       "import": "./dist/geometry/index.js",
       "default": "./dist/geometry/index.js"
     },
-    "./columnar": {
-      "types": "./dist/display/columnar/index.d.ts",
-      "import": "./dist/display/columnar/index.js",
-      "default": "./dist/display/columnar/index.js"
+    "./table": {
+      "types": "./dist/table/index.d.ts",
+      "import": "./dist/table/index.js",
+      "default": "./dist/table/index.js"
+    },
+    "./webgl": {
+      "types": "./dist/webgl/index.d.ts",
+      "import": "./dist/webgl/index.js",
+      "default": "./dist/webgl/index.js"
     },
     "./package.json": "./package.json"
   },
@@ -61,30 +66,45 @@
   "workspaces": [
     "examples",
     "playground",
-    "bench"
+    "bench",
+    "ui"
   ],
   "scripts": {
     "build": "rm -rf dist tsconfig.build.tsbuildinfo && tsc -p tsconfig.build.json",
     "typecheck": "tsc --noEmit",
     "check:spdx": "node scripts/spdx.mjs",
-    "lint": "biome check src examples playground bench scripts && npm run check:layers && npm run check:terms && npm run check:spdx",
+    "lint": "biome check src examples playground bench ui scripts docs/.vitepress/config.mts docs/.vitepress/theme && npm run check:layers && npm run check:terms && npm run check:spdx && node ui/scripts/check-imports.mjs",
     "check:layers": "node scripts/check-layers.mjs",
     "check:terms": "node scripts/check-terms.mjs",
-    "docs:api": "typedoc",
+    "docs:api": "typedoc --options typedoc.site.json",
     "docs:check": "node scripts/docs-check.mjs",
     "docs:image": "node scripts/capture-readme-image.mjs",
-    "build:site": "node scripts/build-site.mjs",
+    "data:overture": "node scripts/fetch-overture-sample.mjs",
+    "site:thumbnails": "node scripts/need-ui.mjs && node scripts/capture-example-thumbnails.mjs",
+    "build:site": "npm run build && npm run ui:build && node scripts/build-site.mjs",
     "deploy:pages": "node scripts/deploy-pages.mjs",
-    "lint:fix": "biome check --write src examples playground bench",
-    "format": "biome format --write src examples playground bench",
+    "lint:fix": "biome check --write src examples playground bench ui",
+    "format": "biome format --write src examples playground bench ui",
     "test": "vitest run",
-    "test:e2e": "vitest run --config src/e2e/vitest.config.ts",
+    "test:e2e": "node scripts/need-ui.mjs && vitest run --config src/e2e/vitest.config.ts",
     "test:watch": "vitest",
-    "dev": "npm run dev -w examples",
+    "dev": "node scripts/need-ui.mjs && npm run dev -w examples",
     "dev:playground": "npm run dev -w playground",
     "dev:bench": "npm run dev -w bench",
-    "check:package": "publint && rm -rf .pack && mkdir -p .pack && npm pack --ignore-scripts --pack-destination .pack >/dev/null && attw .pack/*.tgz --profile esm-only && node --input-type=module -e \"await import('./dist/index.js'); await import('./dist/geometry/index.js'); await import('./dist/display/columnar/index.js'); console.log('dist imports ok')\" && rm -rf .pack",
-    "prepack": "npm run build"
+    "ui:build": "npm run build -w ui",
+    "ui:typecheck": "npm run typecheck -w ui",
+    "ui:test": "npm run test -w ui",
+    "ui:test:e2e": "npm run test:e2e -w ui",
+    "ui:lint": "npm run lint -w ui",
+    "ui:dev": "npm run dev -w ui",
+    "ui:check": "npm run ui:typecheck && npm run ui:test && npm run ui:test:e2e && npm run ui:build",
+    "ui:check:package": "publint ui && rm -rf ui/.pack && mkdir -p ui/.pack && npm pack -w ui --ignore-scripts --pack-destination ui/.pack >/dev/null && attw ui/.pack/*.tgz --profile esm-only --exclude-entrypoints ./style.css && rm -rf ui/.pack",
+    "check:package": "publint && rm -rf .pack && mkdir -p .pack && npm pack --ignore-scripts --pack-destination .pack >/dev/null && attw .pack/*.tgz --profile esm-only && node --input-type=module -e \"await import('./dist/index.js'); await import('./dist/geometry/index.js'); await import('./dist/table/index.js'); await import('./dist/webgl/index.js'); console.log('dist imports ok')\" && rm -rf .pack",
+    "prepack": "npm run build",
+    "site:dev": "node scripts/site-dev.mjs",
+    "site:dev:docs": "npm run docs:api && vitepress dev docs --port 5173 --strictPort",
+    "site:build": "node scripts/need-ui.mjs && npm run docs:api && vitepress build docs",
+    "site:preview": "vitepress preview docs"
   },
   "dependencies": {
     "@types/geojson": "^7946.0.16",
@@ -107,7 +127,10 @@
     "playwright-core": "1.62.1",
     "publint": "^0.3.24",
     "typedoc": "0.28.20",
+    "typedoc-plugin-markdown": "^4.13.1",
+    "typedoc-vitepress-theme": "^1.1.4",
     "typescript": "^6.0.3",
+    "vitepress": "^1.6.4",
     "vitest": "^4.1.11"
   }
 }