@visactor/vchart-extension 2.1.0-alpha.2 → 2.1.0-alpha.20

package/esm/charts/bar-3d/chart.js

@@ -22,4 +22,4 @@ Bar3dChart.type = "bar3d", Bar3dChart.seriesType = SeriesType3dEnum.bar3d, Bar3d
 export const registerBar3dChart = () => {
     register3DPlugin(), registerLayout3d(), registerBar3dSeries(), Factory.registerChart(Bar3dChart.type, Bar3dChart);
 };
-//# sourceMappingURL=chart.js.map
+//# sourceMappingURL=chart.js.map

package/esm/charts/bar-3d/constant.js

@@ -8,4 +8,4 @@ export const bar3dSeriesMark = {
         type: "rect3d"
     }
 };
-//# sourceMappingURL=constant.js.map
+//# sourceMappingURL=constant.js.map

package/esm/charts/bar-3d/index.js

@@ -7,4 +7,4 @@ export * from "./interface";
 export * from "./series";
 
 export * from "./series-spec-transformer";
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/esm/charts/bar-3d/interface.js

@@ -1,2 +1,2 @@
 export { };
-//# sourceMappingURL=interface.js.map
+//# sourceMappingURL=interface.js.map

package/esm/charts/bar-3d/series-spec-transformer.js

@@ -5,4 +5,4 @@ export class Bar3dSeriesSpecTransformer extends BarSeriesSpecTransformer {
         this._addMarkLabelSpec(spec, "bar3d");
     }
 }
-//# sourceMappingURL=series-spec-transformer.js.map
+//# sourceMappingURL=series-spec-transformer.js.map

package/esm/charts/bar-3d/series.js

@@ -27,4 +27,4 @@ export const registerBar3dSeries = () => {
     registerBar3dAnimation(), registerRect3dMark(), registerCartesianBandAxis(), registerCartesianLinearAxis(), 
     Factory.registerSeries(Bar3dSeries.type, Bar3dSeries);
 };
-//# sourceMappingURL=series.js.map
+//# sourceMappingURL=series.js.map

package/esm/charts/bar-3d/theme.js

@@ -12,4 +12,4 @@ export const bar3d = {
         }
     }
 };
-//# sourceMappingURL=theme.js.map
+//# sourceMappingURL=theme.js.map

package/esm/charts/candlestick/candlestick-transformer.js

@@ -13,4 +13,4 @@ export class CandlestickChartSpecTransformer extends CartesianChartSpecTransform
         } ]), setDefaultCrosshairForCartesianChart(spec);
     }
 }
-//# sourceMappingURL=candlestick-transformer.js.map
+//# sourceMappingURL=candlestick-transformer.js.map

package/esm/charts/candlestick/candlestick.js

@@ -19,4 +19,5 @@ CandlestickChart.transformerConstructor = CandlestickChartSpecTransformer;
 export const registerCandlestickChart = () => {
     registerDimensionTooltipProcessor(), registerMarkTooltipProcessor(), registerDimensionEvents(), 
     registerDimensionHover(), registerCandlestickSeries(), Factory.registerChart(CandlestickChart.type, CandlestickChart);
-};
+};
+//# sourceMappingURL=candlestick.js.map

package/esm/charts/candlestick/index.js

@@ -7,4 +7,4 @@ export * from "./candlestick-transformer";
 export * from "./series/candlestick";
 
 export * from "./util";
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/esm/charts/candlestick/interface.js

@@ -1,2 +1,2 @@
 export { };
-//# sourceMappingURL=interface.js.map
+//# sourceMappingURL=interface.js.map

package/esm/charts/candlestick/util.js

@@ -1,4 +1,4 @@
 export function transformCandlestickSeriesSpec(spec) {
     spec.yField = [ spec.openField, spec.highField, spec.lowField, spec.closeField ];
 }
-//# sourceMappingURL=util.js.map
+//# sourceMappingURL=util.js.map

package/esm/charts/combination-candlestick/combination-candlestick-transformer.js

@@ -196,4 +196,4 @@ export class CombinationCandlestickChartSpecTransformer extends CartesianChartSp
         };
     }
 }
-//# sourceMappingURL=combination-candlestick-transformer.js.map
+//# sourceMappingURL=combination-candlestick-transformer.js.map

package/esm/charts/combination-candlestick/combination-candlestick.js

@@ -26,4 +26,4 @@ mixin(CombinationCandlestickChart, StackChartMixin);
 export const registerCombinationCandlestickChart = () => {
     registerCandlestickSeries(), Factory.registerChart(CombinationCandlestickChart.type, CombinationCandlestickChart);
 };
-//# sourceMappingURL=combination-candlestick.js.map
+//# sourceMappingURL=combination-candlestick.js.map

package/esm/charts/combination-candlestick/constant.js

@@ -1,2 +1,2 @@
 export const CombinationCandlestickChart_TYPE = "combinationCandlestick";
-//# sourceMappingURL=constant.js.map
+//# sourceMappingURL=constant.js.map

package/esm/charts/combination-candlestick/index.js

@@ -3,4 +3,4 @@ export * from "./combination-candlestick";
 export * from "./interface";
 
 export * from "./constant";
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/esm/charts/combination-candlestick/interface.js

@@ -1,2 +1,2 @@
 export { };
-//# sourceMappingURL=interface.js.map
+//# sourceMappingURL=interface.js.map

package/esm/charts/conversion-funnel/arrow-data-transform.js

@@ -91,4 +91,4 @@ function computeIndex(arrow, totalArrows) {
     }
     return index;
 }
-//# sourceMappingURL=arrow-data-transform.js.map
+//# sourceMappingURL=arrow-data-transform.js.map

package/esm/charts/conversion-funnel/constants.js

@@ -22,4 +22,4 @@ export const DEFAULT_ARROW_TEXT_MARK_STYLE = {
 export const DEFAULT_FUNNEL_BACKGROUND_MARK_STYLE = {
     fill: "#eff1f9"
 };
-//# sourceMappingURL=constants.js.map
+//# sourceMappingURL=constants.js.map

package/esm/charts/conversion-funnel/conversion-funnel-transformer.js

@@ -190,4 +190,4 @@ function addFunnelBackgroundMark(funnelBackground) {
         })
     });
 }
-//# sourceMappingURL=conversion-funnel-transformer.js.map
+//# sourceMappingURL=conversion-funnel-transformer.js.map

package/esm/charts/conversion-funnel/conversion-funnel.js

@@ -54,4 +54,4 @@ export const registerConversionFunnelChart = option => {
     const vchartConstructor = (null == option ? void 0 : option.VChart) || VChart;
     vchartConstructor && (vchartConstructor.useChart([ ConversionFunnelChart ]), vchartConstructor.useSeries([ ConversionFunnelSeries ]));
 };
-//# sourceMappingURL=conversion-funnel.js.map
+//# sourceMappingURL=conversion-funnel.js.map

package/esm/charts/conversion-funnel/index.js

@@ -1,4 +1,4 @@
 export * from "./interface";
 
 export * from "./conversion-funnel";
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/esm/charts/conversion-funnel/interface.js

@@ -1,2 +1,2 @@
 export { };
-//# sourceMappingURL=interface.js.map
+//# sourceMappingURL=interface.js.map

package/esm/charts/conversion-funnel/util.js

@@ -7,4 +7,4 @@ export function isSameArrow(arrow1, arrow2) {
     const {from: from1, to: to1} = arrow1, {from: from2, to: to2} = arrow2;
     return from1 === from2 && to1 === to2;
 }
-//# sourceMappingURL=util.js.map
+//# sourceMappingURL=util.js.map

package/esm/charts/funnel-3d/chart.js

@@ -21,4 +21,5 @@ Funnel3dChart.transformerConstructor = FunnelChartSpecTransformer;
 export const registerFunnel3dChart = () => {
     registerMarkTooltipProcessor(), register3DPlugin(), registerLayout3d(), registerFunnel3dSeries(), 
     Factory.registerChart(Funnel3dChart.type, Funnel3dChart);
-};
+};
+//# sourceMappingURL=chart.js.map

package/esm/charts/funnel-3d/constant.js

@@ -22,4 +22,4 @@ export const funnel3dSeriesMark = Object.assign(Object.assign({}, baseSeriesMark
         type: "rule"
     }
 });
-//# sourceMappingURL=constant.js.map
+//# sourceMappingURL=constant.js.map

package/esm/charts/funnel-3d/index.js

@@ -5,4 +5,4 @@ export * from "./series";
 export * from "./series-spec-transformer";
 
 export * from "./interface";
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/esm/charts/funnel-3d/interface.js

@@ -1,2 +1,2 @@
 export { };
-//# sourceMappingURL=interface.js.map
+//# sourceMappingURL=interface.js.map

package/esm/charts/funnel-3d/series-spec-transformer.js

@@ -5,4 +5,4 @@ export class Funnel3dSeriesSpecTransformer extends FunnelSeriesSpecTransformer {
         this._addMarkLabelSpec(spec, "funnel3d"), spec.isTransform && this._addMarkLabelSpec(spec, "transform3d", "transformLabel");
     }
 }
-//# sourceMappingURL=series-spec-transformer.js.map
+//# sourceMappingURL=series-spec-transformer.js.map

package/esm/charts/funnel-3d/series.js

@@ -81,4 +81,4 @@ Funnel3dSeries.builtInTheme = {
 export const registerFunnel3dSeries = () => {
     registerPyramid3dMark(), registerTextMark(), registerRuleMark(), Factory.registerSeries(Funnel3dSeries.type, Funnel3dSeries);
 };
-//# sourceMappingURL=series.js.map
+//# sourceMappingURL=series.js.map

package/esm/charts/funnel-3d/theme.js

@@ -1,4 +1,4 @@
 import { getFunnelTheme } from "@visactor/vchart";
 
 export const funnel3d = getFunnelTheme(!0);
-//# sourceMappingURL=theme.js.map
+//# sourceMappingURL=theme.js.map

package/esm/charts/histogram-3d/chart.js

@@ -27,4 +27,4 @@ export const registerHistogram3dChart = () => {
     registerDimensionEvents(), registerDimensionHover(), register3DPlugin(), registerLayout3d(), 
     registerBar3dSeries(), Factory.registerChart(Histogram3dChart.type, Histogram3dChart);
 };
-//# sourceMappingURL=chart.js.map
+//# sourceMappingURL=chart.js.map

package/esm/charts/storyline/index.d.ts

@@ -0,0 +1,4 @@
+export * from './interface';
+export * from './layout';
+export * from './storyline';
+export * from './storyline-transformer';

package/esm/charts/storyline/index.js

@@ -0,0 +1,8 @@
+export * from "./interface";
+
+export * from "./layout";
+
+export * from "./storyline";
+
+export * from "./storyline-transformer";
+//# sourceMappingURL=index.js.map

package/esm/charts/storyline/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/charts/storyline/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,yBAAyB,CAAC","file":"index.js","sourcesContent":["export * from './interface';\nexport * from './layout';\nexport * from './storyline';\nexport * from './storyline-transformer';\n"]}

package/esm/charts/storyline/interface.d.ts

@@ -0,0 +1,69 @@
+import type { IChartSpec, IComposedTextMarkSpec, IImageMarkSpec, IMarkSpec, IPathMarkSpec, IRectMarkSpec, ITextMarkSpec, StringOrNumber } from '@visactor/vchart';
+export type StorylineLayoutType = 'clock' | 'arc' | 'wing' | 'landscape' | 'portrait' | 'ladder' | 'spiral';
+export type StorylineImagePosition = 'top' | 'left' | 'right' | 'bottom';
+export type StorylineLineType = 'line' | 'polyline' | 'curve';
+export type StorylineWingDirection = 'left' | 'right';
+export type StorylineLadderDirection = 'up' | 'down';
+export type StorylineArcDirection = 'up' | 'down';
+export interface IStorylineBlock {
+    id?: StringOrNumber;
+    title?: string;
+    content?: string | string[];
+    image?: string | HTMLImageElement | HTMLCanvasElement;
+    subImage?: string | HTMLImageElement | HTMLCanvasElement;
+    marker?: string;
+    datum?: unknown;
+}
+export interface IStorylineLayoutOptions {
+    type: StorylineLayoutType;
+    padding?: number | [number, number, number, number];
+    radiusRatio?: number;
+    startAngle?: number;
+    endAngle?: number;
+    direction?: StorylineWingDirection | StorylineLadderDirection | StorylineArcDirection;
+    headline?: string;
+}
+export interface IStorylineBlockSpec {
+    width?: number;
+    widthRatio?: number;
+    minWidth?: number;
+    maxWidth?: number;
+    height?: number;
+    padding?: number | [number, number, number, number];
+    gap?: number;
+    showBackground?: boolean;
+    style?: Partial<IRectMarkSpec>;
+}
+export interface IStorylineImageSpec extends IMarkSpec<IImageMarkSpec> {
+    width?: number;
+    height?: number;
+    position?: StorylineImagePosition;
+    gap?: number;
+    showBackground?: boolean;
+}
+export interface IStorylineCenterImageSpec extends IMarkSpec<IImageMarkSpec> {
+    width?: number;
+    height?: number;
+    visible?: boolean;
+    image?: string | HTMLImageElement | HTMLCanvasElement;
+}
+export interface IStorylineLineSpec extends IMarkSpec<IPathMarkSpec> {
+    visible?: boolean;
+    type?: StorylineLineType;
+    showArrow?: boolean;
+    arrowSize?: number;
+    distance?: number;
+}
+export interface IStorylineSpec extends Omit<IChartSpec, 'type' | 'data' | 'series' | 'title' | 'layout'> {
+    type: 'storyline';
+    data: IStorylineBlock[];
+    layout?: StorylineLayoutType | IStorylineLayoutOptions;
+    block?: IStorylineBlockSpec;
+    title?: IMarkSpec<ITextMarkSpec>;
+    content?: IMarkSpec<IComposedTextMarkSpec>;
+    image?: IStorylineImageSpec;
+    centerImage?: IStorylineCenterImageSpec;
+    line?: IStorylineLineSpec;
+    marker?: IMarkSpec<ITextMarkSpec>;
+    themeColor?: string;
+}

package/esm/charts/storyline/interface.js

@@ -0,0 +1,2 @@
+export { };
+//# sourceMappingURL=interface.js.map

package/esm/charts/storyline/interface.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/charts/storyline/interface.ts"],"names":[],"mappings":"","file":"interface.js","sourcesContent":["import type {\n  IChartSpec,\n  IComposedTextMarkSpec,\n  IImageMarkSpec,\n  IMarkSpec,\n  IPathMarkSpec,\n  IRectMarkSpec,\n  ITextMarkSpec,\n  StringOrNumber\n} from '@visactor/vchart';\n\nexport type StorylineLayoutType = 'clock' | 'arc' | 'wing' | 'landscape' | 'portrait' | 'ladder' | 'spiral';\n\nexport type StorylineImagePosition = 'top' | 'left' | 'right' | 'bottom';\nexport type StorylineLineType = 'line' | 'polyline' | 'curve';\nexport type StorylineWingDirection = 'left' | 'right';\nexport type StorylineLadderDirection = 'up' | 'down';\nexport type StorylineArcDirection = 'up' | 'down';\n\nexport interface IStorylineBlock {\n  id?: StringOrNumber;\n  title?: string;\n  content?: string | string[];\n  image?: string | HTMLImageElement | HTMLCanvasElement;\n  /**\n   * 绘制在主 image 背后的装饰图（如 portrait 布局的错位 shadow image）。\n   * 若未配置，则不会绘制装饰 image。\n   */\n  subImage?: string | HTMLImageElement | HTMLCanvasElement;\n  /**\n   * 时间节点文本（如 \"2012\"）。\n   * 仅 portrait 布局生效：在中轴 rect 上沿每个 block 的 center.y 处纵向绘制。\n   * 配合 spec.marker 控制样式与显隐。\n   */\n  marker?: string;\n  datum?: unknown;\n}\n\nexport interface IStorylineLayoutOptions {\n  type: StorylineLayoutType;\n  /**\n   * 边缘留白，支持单值或 [top, right, bottom, left]。\n   */\n  padding?: number | [number, number, number, number];\n  /**\n   * 对 circular/arc 布局生效，控制半径占可用空间的比例。\n   */\n  radiusRatio?: number;\n  /**\n   * 对 circular/arc 布局生效，角度单位为度。\n   */\n  startAngle?: number;\n  /**\n   * 对 circular/arc 布局生效，角度单位为度。\n   */\n  endAngle?: number;\n  /**\n   * 方向控制：\n   * - wing 布局：'left' | 'right'，圆心锚位置；\n   * - ladder 布局：'up' | 'down'，'up' 表示左下→右上对角线（默认），'down' 表示左上→右下对角线；\n   * - arc 布局：'up' | 'down'，'up' 表示穹顶（centerImage 贴底，弧线在上方），'down' 表示碗形（centerImage 贴顶，弧线在下方）。\n   */\n  direction?: StorylineWingDirection | StorylineLadderDirection | StorylineArcDirection;\n  /**\n   * 对 ladder 布局生效：贯穿画布的倾斜大字 headline。\n   * 缺省时使用占位文本。倾斜方向自动跟随对角线。\n   */\n  headline?: string;\n}\n\nexport interface IStorylineBlockSpec {\n  width?: number;\n  widthRatio?: number;\n  minWidth?: number;\n  maxWidth?: number;\n  height?: number;\n  padding?: number | [number, number, number, number];\n  gap?: number;\n  /**\n   * 是否展示 block 背后的卡片背景 rect（白底 + 描边 + 阴影）。\n   * 仅 up-ladder 等少数布局支持，默认 false（不展示）。\n   */\n  showBackground?: boolean;\n  style?: Partial<IRectMarkSpec>;\n}\n\nexport interface IStorylineImageSpec extends IMarkSpec<IImageMarkSpec> {\n  width?: number;\n  height?: number;\n  position?: StorylineImagePosition;\n  gap?: number;\n  /**\n   * 是否展示 image 背后的白色背景 rect（白底 + 主题色描边）。\n   * portrait / landscape / wing 等布局支持。\n   * 默认 false（不展示）。\n   * 注：不影响 subImage（错位装饰图元的显隐。\n   */\n  showBackground?: boolean;\n}\n\nexport interface IStorylineCenterImageSpec extends IMarkSpec<IImageMarkSpec> {\n  width?: number;\n  height?: number;\n  visible?: boolean;\n  image?: string | HTMLImageElement | HTMLCanvasElement;\n}\n\nexport interface IStorylineLineSpec extends IMarkSpec<IPathMarkSpec> {\n  visible?: boolean;\n  type?: StorylineLineType;\n  showArrow?: boolean;\n  arrowSize?: number;\n  /**\n   * 连接线和 block 边缘之间的距离。\n   */\n  distance?: number;\n}\n\nexport interface IStorylineSpec extends Omit<IChartSpec, 'type' | 'data' | 'series' | 'title' | 'layout'> {\n  type: 'storyline';\n  data: IStorylineBlock[];\n  layout?: StorylineLayoutType | IStorylineLayoutOptions;\n  block?: IStorylineBlockSpec;\n  title?: IMarkSpec<ITextMarkSpec>;\n  content?: IMarkSpec<IComposedTextMarkSpec>;\n  image?: IStorylineImageSpec;\n  centerImage?: IStorylineCenterImageSpec;\n  line?: IStorylineLineSpec;\n  /**\n   * 时间节点文本配置（仅 portrait 布局生效）。\n   * 当 spec.data[i].marker 有值时，在中轴 rect 上沿垂直方向绘制每个 block 的时间节点文本。\n   */\n  marker?: IMarkSpec<ITextMarkSpec>;\n  themeColor?: string;\n}\n"]}

package/esm/charts/storyline/layout.d.ts

@@ -0,0 +1,58 @@
+import type { IStorylineBlock, IStorylineLayoutOptions, StorylineLayoutType } from './interface';
+export interface StorylineSize {
+    width: number;
+    height: number;
+}
+export interface StorylinePadding {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+}
+export interface StorylinePoint {
+    x: number;
+    y: number;
+}
+export interface StorylineBlockPosition extends StorylinePoint, StorylineSize {
+    id: string | number;
+    index: number;
+    datum: IStorylineBlock;
+    center: StorylinePoint;
+}
+export interface StorylineLinkPosition {
+    from: StorylineBlockPosition;
+    to: StorylineBlockPosition;
+    start: StorylinePoint;
+    end: StorylinePoint;
+    points: StorylinePoint[];
+}
+export interface StorylineCircleGuide {
+    center: StorylinePoint;
+    radius: number;
+}
+export interface StorylineLayoutResult {
+    blocks: StorylineBlockPosition[];
+    links: StorylineLinkPosition[];
+    circleGuide?: StorylineCircleGuide;
+}
+export interface StorylineComputeOptions {
+    layout: StorylineLayoutType | IStorylineLayoutOptions | undefined;
+    viewBox: StorylineSize;
+    block: StorylineSize;
+    gap?: number;
+    padding?: number | [number, number, number, number];
+    lineDistance?: number;
+}
+export declare const normalizePadding: (padding?: number | [
+    number,
+    number,
+    number,
+    number
+] | {
+    top?: number;
+    right?: number;
+    bottom?: number;
+    left?: number;
+}) => StorylinePadding;
+export declare const normalizeLayout: (layout?: StorylineLayoutType | IStorylineLayoutOptions) => IStorylineLayoutOptions;
+export declare const computeStorylineLayout: (data: IStorylineBlock[], options: StorylineComputeOptions) => StorylineLayoutResult;

package/esm/charts/storyline/layout.js

@@ -0,0 +1,204 @@
+const DEFAULT_LAYOUT = "landscape", DEFAULT_PADDING = 24;
+
+export const normalizePadding = padding => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    if (Array.isArray(padding)) return {
+        top: null !== (_a = padding[0]) && void 0 !== _a ? _a : 0,
+        right: null !== (_b = padding[1]) && void 0 !== _b ? _b : 0,
+        bottom: null !== (_c = padding[2]) && void 0 !== _c ? _c : 0,
+        left: null !== (_d = padding[3]) && void 0 !== _d ? _d : 0
+    };
+    if (padding && "object" == typeof padding && "top" in padding) return {
+        top: null !== (_e = padding.top) && void 0 !== _e ? _e : 0,
+        right: null !== (_f = padding.right) && void 0 !== _f ? _f : 0,
+        bottom: null !== (_g = padding.bottom) && void 0 !== _g ? _g : 0,
+        left: null !== (_h = padding.left) && void 0 !== _h ? _h : 0
+    };
+    const value = null !== (_j = padding) && void 0 !== _j ? _j : 24;
+    return {
+        top: value,
+        right: value,
+        bottom: value,
+        left: value
+    };
+};
+
+export const normalizeLayout = layout => layout ? "string" == typeof layout ? {
+    type: layout
+} : layout : {
+    type: "landscape"
+};
+
+export const computeStorylineLayout = (data, options) => {
+    var _a, _b, _c;
+    const layout = normalizeLayout(options.layout), padding = normalizePadding(null !== (_a = layout.padding) && void 0 !== _a ? _a : options.padding), gap = null !== (_b = options.gap) && void 0 !== _b ? _b : 40, lineDistance = null !== (_c = options.lineDistance) && void 0 !== _c ? _c : 8, blocks = computeBlockPositions(data, layout, options.viewBox, options.block, padding, gap), circleGuide = "clock" === layout.type ? computeClockCircleGuide(options.viewBox, options.block, padding, layout) : void 0;
+    return {
+        blocks: blocks,
+        links: computeLinks(blocks, lineDistance),
+        circleGuide: circleGuide
+    };
+};
+
+const computeBlockPositions = (data, layout, viewBox, block, padding, gap) => {
+    const count = data.length;
+    if (!count) return [];
+    const inner = {
+        x: padding.left,
+        y: padding.top,
+        width: Math.max(viewBox.width - padding.left - padding.right, block.width),
+        height: Math.max(viewBox.height - padding.top - padding.bottom, block.height)
+    }, center = {
+        x: inner.x + inner.width / 2,
+        y: inner.y + inner.height / 2
+    };
+    let centers;
+    switch (layout.type) {
+      case "portrait":
+        centers = lineCenters(count, center.x, inner.y + block.height / 2, center.x, inner.y + inner.height - block.height / 2);
+        break;
+
+      case "ladder":
+        {
+            const isDown = "down" === layout.direction, x0 = inner.x + block.width / 2, x1 = inner.x + inner.width - block.width / 2, yTop = inner.y + block.height / 2, yBot = inner.y + inner.height - block.height / 2, y0 = isDown ? yTop : yBot, y1 = isDown ? yBot : yTop, anchors = lineCenters(count, x0, y0, x1, y1), dx = x1 - x0, dy = y1 - y0, len = Math.hypot(dx, dy) || 1, nx = -dy / len, ny = dx / len, offset = 1.2 * Math.max(80, Math.min(240, Math.round(.42 * inner.height)));
+            centers = anchors.map(((p, i) => {
+                const sign = i % 2 == 0 ? 1 : -1;
+                return {
+                    x: p.x + nx * offset * sign,
+                    y: p.y + ny * offset * sign
+                };
+            }));
+            break;
+        }
+
+      case "spiral":
+        centers = alternatingVerticalCenters(count, inner, block, gap);
+        break;
+
+      case "clock":
+        centers = circularCenters(count, viewBox, block, padding, layout);
+        break;
+
+      case "arc":
+        {
+            const isDown = "down" === layout.direction, [s, e] = isDown ? [ 20, 160 ] : [ 200, 340 ];
+            centers = arcCenters(count, inner, block, layout, s, e);
+            break;
+        }
+
+      case "wing":
+        {
+            const direction = "right" === layout.direction ? "right" : "left", [s, e] = "right" === direction ? [ 110, 250 ] : [ -70, 70 ];
+            centers = arcCenters(count, inner, block, layout, s, e);
+            break;
+        }
+
+      default:
+        centers = lineCenters(count, inner.x + block.width / 2, center.y, inner.x + inner.width - block.width / 2, center.y);
+    }
+    return centers.map(((point, index) => {
+        var _a, _b;
+        return {
+            id: null !== (_b = null === (_a = data[index]) || void 0 === _a ? void 0 : _a.id) && void 0 !== _b ? _b : index,
+            index: index,
+            datum: data[index],
+            width: block.width,
+            height: block.height,
+            x: point.x - block.width / 2,
+            y: point.y - block.height / 2,
+            center: point
+        };
+    }));
+}, lineCenters = (count, x0, y0, x1, y1) => 1 === count ? [ {
+    x: (x0 + x1) / 2,
+    y: (y0 + y1) / 2
+} ] : Array.from({
+    length: count
+}, ((_, index) => {
+    const t = index / (count - 1);
+    return {
+        x: x0 + (x1 - x0) * t,
+        y: y0 + (y1 - y0) * t
+    };
+})), alternatingVerticalCenters = (count, inner, block, gap) => {
+    const baseX = inner.x + inner.width / 2, offset = Math.min(Math.max(.65 * block.width + gap / 2, 0), Math.max((inner.width - block.width) / 2, 0));
+    return lineCenters(count, baseX, inner.y + block.height / 2, baseX, inner.y + inner.height - block.height / 2).map(((point, index) => ({
+        x: point.x + (index % 2 == 0 ? -offset : offset),
+        y: point.y
+    })));
+}, circularCenters = (count, viewBox, block, padding, layout) => {
+    var _a;
+    const guide = computeClockCircleGuide(viewBox, block, padding, layout), startAngle = null !== (_a = layout.startAngle) && void 0 !== _a ? _a : -90;
+    if (1 === count) {
+        const angle = degreeToRadian(startAngle);
+        return [ {
+            x: guide.center.x + Math.cos(angle) * guide.radius,
+            y: guide.center.y + Math.sin(angle) * guide.radius
+        } ];
+    }
+    return Array.from({
+        length: count
+    }, ((_, index) => {
+        const angle = degreeToRadian(startAngle + 360 * index / count);
+        return {
+            x: guide.center.x + Math.cos(angle) * guide.radius,
+            y: guide.center.y + Math.sin(angle) * guide.radius
+        };
+    }));
+}, computeClockCircleGuide = (viewBox, block, padding, layout) => {
+    var _a;
+    const innerWidth = Math.max(viewBox.width - padding.left - padding.right, 1), innerHeight = Math.max(viewBox.height - padding.top - padding.bottom, 1), center = {
+        x: padding.left + innerWidth / 2,
+        y: padding.top + innerHeight / 2
+    }, ratio = null !== (_a = layout.radiusRatio) && void 0 !== _a ? _a : .7, maxRadius = Math.max(Math.min(innerWidth - block.width, innerHeight - block.height) / 2, 1);
+    return {
+        center: center,
+        radius: Math.max(1, maxRadius * ratio)
+    };
+}, arcCenters = (count, inner, block, layout, fallbackStartAngle, fallbackEndAngle, defaultRatio = .88) => {
+    var _a, _b, _c, _d, _e;
+    const startAngle = null !== (_b = null !== (_a = layout.startAngle) && void 0 !== _a ? _a : fallbackStartAngle) && void 0 !== _b ? _b : -90, endAngle = null !== (_d = null !== (_c = layout.endAngle) && void 0 !== _c ? _c : fallbackEndAngle) && void 0 !== _d ? _d : 270, ratio = null !== (_e = layout.radiusRatio) && void 0 !== _e ? _e : defaultRatio, rx = Math.max((inner.width - block.width) / 2, 1) * ratio, ry = Math.max((inner.height - block.height) / 2, 1) * ratio, center_x = inner.x + inner.width / 2, center_y = inner.y + inner.height / 2;
+    if (1 === count) {
+        const angle = degreeToRadian((startAngle + endAngle) / 2);
+        return [ {
+            x: center_x + Math.cos(angle) * rx,
+            y: center_y + Math.sin(angle) * ry
+        } ];
+    }
+    return Array.from({
+        length: count
+    }, ((_, index) => {
+        const t = index / (count - 1), angle = degreeToRadian(startAngle + angleDelta(startAngle, endAngle) * t);
+        return {
+            x: center_x + Math.cos(angle) * rx,
+            y: center_y + Math.sin(angle) * ry
+        };
+    }));
+}, angleDelta = (startAngle, endAngle) => {
+    const delta = endAngle - startAngle;
+    return Math.abs(delta) >= 360 ? 360 : delta;
+}, degreeToRadian = degree => degree / 180 * Math.PI, computeLinks = (blocks, distance) => {
+    const links = [];
+    for (let i = 0; i < blocks.length - 1; i++) {
+        const from = blocks[i], to = blocks[i + 1], start = pointOnBlockEdge(from, to.center, distance), end = pointOnBlockEdge(to, from.center, distance);
+        links.push({
+            from: from,
+            to: to,
+            start: start,
+            end: end,
+            points: [ start, end ]
+        });
+    }
+    return links;
+}, pointOnBlockEdge = (block, toward, distance) => {
+    const dx = toward.x - block.center.x, dy = toward.y - block.center.y;
+    if (0 === dx && 0 === dy) return {
+        x: block.center.x,
+        y: block.center.y
+    };
+    const scaleX = 0 === dx ? Number.POSITIVE_INFINITY : block.width / 2 / Math.abs(dx), scaleY = 0 === dy ? Number.POSITIVE_INFINITY : block.height / 2 / Math.abs(dy), scale = Math.min(scaleX, scaleY), length = Math.sqrt(dx * dx + dy * dy) || 1;
+    return {
+        x: block.center.x + dx * scale + dx / length * distance,
+        y: block.center.y + dy * scale + dy / length * distance
+    };
+};
+//# sourceMappingURL=layout.js.map