@mogura/moguchart-plugin-export 1.1.0 → 1.2.0

package/README.ja.md

@@ -62,6 +62,18 @@ async function handleExportPdf(chartElement) {
 }
 ```
 
+## プラグイン初期化設定 (`ExportPluginConfig`)
+
+```typescript
+chart.use(
+  exportPlugin({
+    defaultScale: 2, // PNG出力時のデフォルト解像度倍率
+    defaultFilename: 'my-schedule', // デフォルトファイル名
+    normalizeZoom: true, // エクスポート時に一時的にズーム倍率を100%に正規化するか（デフォルト: true）
+  })
+)
+```
+
 ## オプション (`ExportImageOptions`)
 
 | オプション | 型 | デフォルト値 | 説明 |
@@ -70,6 +82,7 @@ async function handleExportPdf(chartElement) {
 | `download` | `boolean` | `false` | `true` の場合、自動的にファイルダウンロードをトリガー |
 | `scale` | `number` | `2` | PNG 出力時の解像度倍率 |
 | `splitHeight` | `number` | 未指定 | 指定ピクセル数で縦に分割し、分割位置にカレンダーヘッダーを挿入 |
+| `normalizeZoom` | `boolean` | `true` | エクスポート時に一時的にズーム倍率を100%（標準スケール）に正規化して出力 |
 
 ## ライセンス
 

package/README.md

@@ -62,6 +62,18 @@ async function handleExportPdf(chartElement) {
 }
 ```
 
+## Plugin Configuration (`ExportPluginConfig`)
+
+```typescript
+chart.use(
+  exportPlugin({
+    defaultScale: 2, // Default resolution multiplier for PNG export
+    defaultFilename: 'my-schedule', // Default output filename
+    normalizeZoom: true, // Temporarily normalize zoom to 100% during export (default: true)
+  })
+)
+```
+
 ## Options (`ExportImageOptions`)
 
 | Option | Type | Default | Description |
@@ -70,6 +82,7 @@ async function handleExportPdf(chartElement) {
 | `download` | `boolean` | `false` | If `true`, automatically triggers browser file download |
 | `scale` | `number` | `2` | Resolution multiplier for PNG rendering |
 | `splitHeight` | `number` | `undefined` | Split height in pixels for vertical multi-page division with repeating calendar headers |
+| `normalizeZoom` | `boolean` | `true` | Temporarily normalize zoom level to 100% (baseline scale) during export |
 
 ## License
 

package/dist/export.d.ts

@@ -11,6 +11,8 @@ export interface ExportImageOptions {
     scale?: number;
     /** 画像を指定したピクセル数で縦に分割し、分割位置にカレンダー（ヘッダー）を挿入する。未指定時は分割しない */
     splitHeight?: number;
+    /** エクスポート時に一時的にズーム倍率を100%に正規化するかどうか。デフォルト: true */
+    normalizeZoom?: boolean;
 }
 /**
  * html2canvas-pro を使用してエクスポートする（Shadow DOMネイティブ対応版）

package/dist/index.d.ts

@@ -3,6 +3,8 @@ import { exportGanttWithHtml2Canvas, type ExportImageOptions } from './export';
 export interface ExportPluginConfig {
     defaultScale?: number;
     defaultFilename?: string;
+    /** エクスポート時に一時的にズーム倍率を100%に正規化するかどうか。デフォルト: true */
+    normalizeZoom?: boolean;
 }
 /**
  * ガントチャートのエクスポート（PNG/PDF）プラグイン

package/dist/moguchart-plugin-export.mjs

@@ -98,16 +98,17 @@ function a(e) {
 				...n
 			};
 			t.exportImage = async (e = "png", n = {}) => {
-				let a = t._scrollContainer || t.shadowRoot?.querySelector(".scroll-container"), o = a ? a.scrollLeft : 0, s = a ? a.scrollTop : 0;
-				t.isExporting = !0, await t.updateComplete, await new Promise((e) => requestAnimationFrame(e));
+				let a = t._scrollContainer || t.shadowRoot?.querySelector(".scroll-container"), o = a ? a.scrollLeft : 0, s = a ? a.scrollTop : 0, c = n.normalizeZoom ?? r.normalizeZoom ?? !0, l = typeof t.getZoomPercent == "function" ? t.getZoomPercent() : 100, u = c && typeof t.zoomToPercent == "function" && l !== 100;
+				u && (t.zoomToPercent(100), await t.updateComplete), t.isExporting = !0, await t.updateComplete, await new Promise((e) => requestAnimationFrame(e));
 				try {
 					return await i(t, e, {
 						scale: r.defaultScale ?? 2,
 						filename: r.defaultFilename,
+						normalizeZoom: c,
 						...n
 					});
 				} finally {
-					t.isExporting = !1, await t.updateComplete, a && (a.scrollLeft = o, a.scrollTop = s);
+					t.isExporting = !1, u && t.zoomToPercent(l), await t.updateComplete, a && (a.scrollLeft = o, a.scrollTop = s);
 				}
 			};
 		}
@@ -122,12 +123,12 @@ var o = class {
 	}
 };
 async function s(e, t = "png", n = {}) {
-	let r = e._scrollContainer || e.shadowRoot?.querySelector(".scroll-container"), a = r ? r.scrollLeft : 0, o = r ? r.scrollTop : 0;
-	e.isExporting = !0, await e.updateComplete, await new Promise((e) => requestAnimationFrame(e));
+	let r = e._scrollContainer || e.shadowRoot?.querySelector(".scroll-container"), a = r ? r.scrollLeft : 0, o = r ? r.scrollTop : 0, s = n.normalizeZoom ?? !0, c = typeof e.getZoomPercent == "function" ? e.getZoomPercent() : 100, l = s && typeof e.zoomToPercent == "function" && c !== 100;
+	l && (e.zoomToPercent(100), await e.updateComplete), e.isExporting = !0, await e.updateComplete, await new Promise((e) => requestAnimationFrame(e));
 	try {
 		return await i(e, t, n);
 	} finally {
-		e.isExporting = !1, await e.updateComplete, r && (r.scrollLeft = a, r.scrollTop = o);
+		e.isExporting = !1, l && e.zoomToPercent(c), await e.updateComplete, r && (r.scrollLeft = a, r.scrollTop = o);
 	}
 }
 //#endregion

package/dist/moguchart-plugin-export.umd.js

@@ -1 +1 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("html2canvas-pro"),require("jspdf"),require("@mogura/moguchart-core")):typeof define==`function`&&define.amd?define([`exports`,`html2canvas-pro`,`jspdf`,`@mogura/moguchart-core`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.MoguchartPluginExport={},e.html2canvas,e.jsPDF,e.MoguchartCore))})(this,function(e,t,n,r){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var i=Object.create,a=Object.defineProperty,o=Object.getOwnPropertyDescriptor,s=Object.getOwnPropertyNames,c=Object.getPrototypeOf,l=Object.prototype.hasOwnProperty,u=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=s(t),c=0,u=i.length,d;c<u;c++)d=i[c],!l.call(e,d)&&d!==n&&a(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=o(t,d))||r.enumerable});return e};t=((e,t,n)=>(n=e==null?{}:i(c(e)),u(t||!e||!e.__esModule||!l.call(e,`default`)?a(n,`default`,{value:e,enumerable:!0}):n,e)))(t,1);function d(e,t){let n=document.createElement(`a`);n.href=e,n.download=t,n.click()}async function f(e,i=`png`,a={}){let{filename:o=`gantt-chart`,download:s=!1,scale:c=2,splitHeight:l}=a,u=e.shadowRoot?.querySelector(`.scroll-container`),f=u?u.scrollWidth:e.scrollWidth,p=u?u.scrollHeight:e.scrollHeight,m=u||e,h=(0,r.getThemeColors)(e.theme,e.option?.customTheme).bg||`#ffffff`,g=await(0,t.default)(m,{backgroundColor:h,scale:c,width:f,height:p,windowWidth:f,windowHeight:p,scrollX:0,scrollY:0,x:0,y:0,logging:!1});if(l&&p>l){let t=50,n=e.shadowRoot?.querySelector(`gantt-calendar`);n&&n.offsetHeight>0?t=n.offsetHeight:e.calendarHeight&&(t=e.calendarHeight);let r=g.height/p,i=p-t,a=l-t,o=[];typeof e.getRowPositions==`function`&&(o=e.getRowPositions().map(e=>e.bottom));let s=[0],c=0;if(a>0)for(;c<i;){let e=c+a;if(e>=i){s.push(i);break}let t=-1;for(let n=0;n<o.length;n++){let r=o[n];r>c&&r<=e&&(t=Math.max(t,r))}if(t===-1)for(let e=0;e<o.length;e++){let n=o[e];if(n>c){t=n;break}}(t===-1||t===c)&&(t=e),s.push(t),c=t}else s.push(i);let u=s.length-1;if(u>0){let e=Math.floor(t*r),n=g.width,i=0,a=[];for(let n=0;n<u;n++){let o=s[n],c=s[n+1],l=Math.round((t+o)*r),u=Math.round((t+c)*r),d=u-l;a.push({srcStart:l,srcEnd:u,destHeight:d}),i+=e+d}let o=document.createElement(`canvas`);o.width=n,o.height=i;let c=o.getContext(`2d`);if(c){let t=0;for(let r=0;r<u;r++){c.drawImage(g,0,0,n,e,0,t,n,e),t+=e;let i=a[r];c.drawImage(g,0,i.srcStart,n,i.destHeight,0,t,n,i.destHeight),t+=i.destHeight}g=o,p=i/r}else console.warn(`[export] Failed to get 2D context for new canvas. It might be too large.`)}}if(i===`pdf`){let e=g.toDataURL(`image/jpeg`,.9),t=new n.jsPDF({orientation:f>p?`l`:`p`,unit:`px`,format:[f,p],compress:!0});return t.addImage(e,`JPEG`,0,0,f,p,void 0,`FAST`),s&&t.save(`${o}.pdf`),t.output(`blob`)}{let e=g.toDataURL(`image/png`);return s&&d(e,`${o}.png`),e}}function p(e){return{name:`export`,version:`1.0.0`,install(t,n){let r={...e,...n};t.exportImage=async(e=`png`,n={})=>{let i=t._scrollContainer||t.shadowRoot?.querySelector(`.scroll-container`),a=i?i.scrollLeft:0,o=i?i.scrollTop:0;t.isExporting=!0,await t.updateComplete,await new Promise(e=>requestAnimationFrame(e));try{return await f(t,e,{scale:r.defaultScale??2,filename:r.defaultFilename,...n})}finally{t.isExporting=!1,await t.updateComplete,i&&(i.scrollLeft=a,i.scrollTop=o)}}}}}var m=class{constructor(e){this.name=`export`,this.version=`1.0.0`,this.config=e}install(e,t){return p(this.config).install?.(e,t)}};async function h(e,t=`png`,n={}){let r=e._scrollContainer||e.shadowRoot?.querySelector(`.scroll-container`),i=r?r.scrollLeft:0,a=r?r.scrollTop:0;e.isExporting=!0,await e.updateComplete,await new Promise(e=>requestAnimationFrame(e));try{return await f(e,t,n)}finally{e.isExporting=!1,await e.updateComplete,r&&(r.scrollLeft=i,r.scrollTop=a)}}e.ExportPlugin=m,e.exportChart=h,e.exportGanttWithHtml2Canvas=f,e.exportPlugin=p});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("html2canvas-pro"),require("jspdf"),require("@mogura/moguchart-core")):typeof define==`function`&&define.amd?define([`exports`,`html2canvas-pro`,`jspdf`,`@mogura/moguchart-core`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.MoguchartPluginExport={},e.html2canvas,e.jsPDF,e.MoguchartCore))})(this,function(e,t,n,r){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var i=Object.create,a=Object.defineProperty,o=Object.getOwnPropertyDescriptor,s=Object.getOwnPropertyNames,c=Object.getPrototypeOf,l=Object.prototype.hasOwnProperty,u=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=s(t),c=0,u=i.length,d;c<u;c++)d=i[c],!l.call(e,d)&&d!==n&&a(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=o(t,d))||r.enumerable});return e};t=((e,t,n)=>(n=e==null?{}:i(c(e)),u(t||!e||!e.__esModule||!l.call(e,`default`)?a(n,`default`,{value:e,enumerable:!0}):n,e)))(t,1);function d(e,t){let n=document.createElement(`a`);n.href=e,n.download=t,n.click()}async function f(e,i=`png`,a={}){let{filename:o=`gantt-chart`,download:s=!1,scale:c=2,splitHeight:l}=a,u=e.shadowRoot?.querySelector(`.scroll-container`),f=u?u.scrollWidth:e.scrollWidth,p=u?u.scrollHeight:e.scrollHeight,m=u||e,h=(0,r.getThemeColors)(e.theme,e.option?.customTheme).bg||`#ffffff`,g=await(0,t.default)(m,{backgroundColor:h,scale:c,width:f,height:p,windowWidth:f,windowHeight:p,scrollX:0,scrollY:0,x:0,y:0,logging:!1});if(l&&p>l){let t=50,n=e.shadowRoot?.querySelector(`gantt-calendar`);n&&n.offsetHeight>0?t=n.offsetHeight:e.calendarHeight&&(t=e.calendarHeight);let r=g.height/p,i=p-t,a=l-t,o=[];typeof e.getRowPositions==`function`&&(o=e.getRowPositions().map(e=>e.bottom));let s=[0],c=0;if(a>0)for(;c<i;){let e=c+a;if(e>=i){s.push(i);break}let t=-1;for(let n=0;n<o.length;n++){let r=o[n];r>c&&r<=e&&(t=Math.max(t,r))}if(t===-1)for(let e=0;e<o.length;e++){let n=o[e];if(n>c){t=n;break}}(t===-1||t===c)&&(t=e),s.push(t),c=t}else s.push(i);let u=s.length-1;if(u>0){let e=Math.floor(t*r),n=g.width,i=0,a=[];for(let n=0;n<u;n++){let o=s[n],c=s[n+1],l=Math.round((t+o)*r),u=Math.round((t+c)*r),d=u-l;a.push({srcStart:l,srcEnd:u,destHeight:d}),i+=e+d}let o=document.createElement(`canvas`);o.width=n,o.height=i;let c=o.getContext(`2d`);if(c){let t=0;for(let r=0;r<u;r++){c.drawImage(g,0,0,n,e,0,t,n,e),t+=e;let i=a[r];c.drawImage(g,0,i.srcStart,n,i.destHeight,0,t,n,i.destHeight),t+=i.destHeight}g=o,p=i/r}else console.warn(`[export] Failed to get 2D context for new canvas. It might be too large.`)}}if(i===`pdf`){let e=g.toDataURL(`image/jpeg`,.9),t=new n.jsPDF({orientation:f>p?`l`:`p`,unit:`px`,format:[f,p],compress:!0});return t.addImage(e,`JPEG`,0,0,f,p,void 0,`FAST`),s&&t.save(`${o}.pdf`),t.output(`blob`)}{let e=g.toDataURL(`image/png`);return s&&d(e,`${o}.png`),e}}function p(e){return{name:`export`,version:`1.0.0`,install(t,n){let r={...e,...n};t.exportImage=async(e=`png`,n={})=>{let i=t._scrollContainer||t.shadowRoot?.querySelector(`.scroll-container`),a=i?i.scrollLeft:0,o=i?i.scrollTop:0,s=n.normalizeZoom??r.normalizeZoom??!0,c=typeof t.getZoomPercent==`function`?t.getZoomPercent():100,l=s&&typeof t.zoomToPercent==`function`&&c!==100;l&&(t.zoomToPercent(100),await t.updateComplete),t.isExporting=!0,await t.updateComplete,await new Promise(e=>requestAnimationFrame(e));try{return await f(t,e,{scale:r.defaultScale??2,filename:r.defaultFilename,normalizeZoom:s,...n})}finally{t.isExporting=!1,l&&t.zoomToPercent(c),await t.updateComplete,i&&(i.scrollLeft=a,i.scrollTop=o)}}}}}var m=class{constructor(e){this.name=`export`,this.version=`1.0.0`,this.config=e}install(e,t){return p(this.config).install?.(e,t)}};async function h(e,t=`png`,n={}){let r=e._scrollContainer||e.shadowRoot?.querySelector(`.scroll-container`),i=r?r.scrollLeft:0,a=r?r.scrollTop:0,o=n.normalizeZoom??!0,s=typeof e.getZoomPercent==`function`?e.getZoomPercent():100,c=o&&typeof e.zoomToPercent==`function`&&s!==100;c&&(e.zoomToPercent(100),await e.updateComplete),e.isExporting=!0,await e.updateComplete,await new Promise(e=>requestAnimationFrame(e));try{return await f(e,t,n)}finally{e.isExporting=!1,c&&e.zoomToPercent(s),await e.updateComplete,r&&(r.scrollLeft=i,r.scrollTop=a)}}e.ExportPlugin=m,e.exportChart=h,e.exportGanttWithHtml2Canvas=f,e.exportPlugin=p});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mogura/moguchart-plugin-export",
   "type": "module",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "PNG and PDF export plugin for @mogura/moguchart-core",
   "license": "MIT",
   "author": "Murakami Hiroyuki",
@@ -25,6 +25,7 @@
   ],
   "files": [
     "dist",
+    "LICENSE",
     "README.md",
     "README.ja.md"
   ],
@@ -40,7 +41,7 @@
   },
   "peerDependencies": {
     "lit": "^3.0.0",
-    "@mogura/moguchart-core": "1.1.0"
+    "@mogura/moguchart-core": "1.2.0"
   },
   "dependencies": {
     "html2canvas-pro": "^2.0.2",
@@ -53,7 +54,7 @@
     "typescript": "^5.9.3",
     "vite": "^8.0.0",
     "vitest": "^4.0.16",
-    "@mogura/moguchart-core": "1.1.0"
+    "@mogura/moguchart-core": "1.2.0"
   },
   "scripts": {
     "build": "vite build && pnpm exec tsc -p tsconfig.build.json",