@linkiez/dxf-renew 5.3.1 → 7.1.0

package/lib/dimensionToSVG.js

@@ -1,5 +1,167 @@
 import { Box2 } from "vecks";
 import colors from "./util/colors";
+import escapeXmlText from "./util/escapeXmlText";
+import round10 from "./util/round10";
+const DEFAULT_DIMENSION_DECIMALS = 2;
+const AUTOSCALE_VIEWPORT_REFERENCE = 40;
+const computeViewportAutoScaleFactor = (viewport, options) => {
+  const viewportMin = Math.min(Math.abs(viewport.width), Math.abs(viewport.height));
+  if (!Number.isFinite(viewportMin) || viewportMin <= 0) return 1;
+  const reference = options?.dimension?.autoScaleViewportReference;
+  const safeReference = Number.isFinite(reference) && (reference ?? 0) > 0 ? reference : AUTOSCALE_VIEWPORT_REFERENCE;
+  return viewportMin / safeReference;
+};
+const getViewportMin = (viewport) => {
+  const viewportMin = Math.min(Math.abs(viewport.width), Math.abs(viewport.height));
+  return Number.isFinite(viewportMin) ? viewportMin : Number.NaN;
+};
+const getViewportPercentageSize = (viewport, percent) => {
+  if (!Number.isFinite(percent) || (percent ?? 0) <= 0) return void 0;
+  const viewportMin = getViewportMin(viewport);
+  if (!Number.isFinite(viewportMin) || viewportMin <= 0) return void 0;
+  return viewportMin * (percent / 100);
+};
+const getDimensionGeometryBBox = (entity) => {
+  const bbox = new Box2();
+  const points = [
+    entity.start,
+    entity.angleVertex,
+    entity.arcPoint,
+    entity.textMidpoint,
+    entity.measureStart,
+    entity.measureEnd
+  ];
+  for (const p of points) {
+    if (!p) continue;
+    const x = p.x;
+    const y = p.y;
+    if (!Number.isFinite(x) || !Number.isFinite(y)) continue;
+    bbox.expandByPoint({ x, y });
+  }
+  return bbox;
+};
+const getScaledDimensionSizes = (dimStyle, options, viewport) => {
+  const autoScale = options?.dimension?.autoScale === true;
+  const baseArrowSize = dimStyle?.dimAsz ?? 2.5;
+  const baseTextHeight = dimStyle?.dimTxt ?? 2.5;
+  const baseExtLineOffset = dimStyle?.dimExo ?? 0.625;
+  const baseExtLineExtension = dimStyle?.dimExe ?? 1.25;
+  if (!autoScale || !viewport) {
+    return {
+      arrowSize: baseArrowSize,
+      textHeight: baseTextHeight,
+      extLineOffset: baseExtLineOffset,
+      extLineExtension: baseExtLineExtension
+    };
+  }
+  const scale = computeViewportAutoScaleFactor(viewport, options);
+  const perc = options?.dimension?.autoScaleViewportPercentages;
+  const arrowFromPct = getViewportPercentageSize(viewport, perc?.arrowSize);
+  const textFromPct = getViewportPercentageSize(viewport, perc?.textHeight);
+  const offsetFromPct = getViewportPercentageSize(viewport, perc?.extLineOffset);
+  const extensionFromPct = getViewportPercentageSize(viewport, perc?.extLineExtension);
+  return {
+    arrowSize: arrowFromPct ?? baseArrowSize * scale,
+    textHeight: textFromPct ?? baseTextHeight * scale,
+    extLineOffset: offsetFromPct ?? baseExtLineOffset * scale,
+    extLineExtension: extensionFromPct ?? baseExtLineExtension * scale
+  };
+};
+const formatDimensionValue = (value, decimals = DEFAULT_DIMENSION_DECIMALS) => {
+  if (!Number.isFinite(value)) return "";
+  const rounded = round10(value, -decimals);
+  return rounded.toFixed(decimals);
+};
+const computeRadiusFallback = (entity) => {
+  const cx = entity.start?.x ?? 0;
+  const cy = entity.start?.y ?? 0;
+  const x1 = entity.measureStart?.x ?? 0;
+  const y1 = entity.measureStart?.y ?? 0;
+  const x2 = entity.measureEnd?.x ?? 0;
+  const y2 = entity.measureEnd?.y ?? 0;
+  const r1 = Math.hypot(x1 - cx, y1 - cy);
+  const r2 = Math.hypot(x2 - cx, y2 - cy);
+  const chord = Math.hypot(x2 - x1, y2 - y1);
+  return Math.max(r1, r2, chord);
+};
+const computeLinearDistance = (x1, y1, x2, y2) => Math.hypot(x2 - x1, y2 - y1);
+const computeAngularDegreesMinimal = (cx, cy, x1, y1, x2, y2) => {
+  const a1 = Math.atan2(y1 - cy, x1 - cx);
+  const a2 = Math.atan2(y2 - cy, x2 - cx);
+  let delta = Math.abs(a2 - a1);
+  while (delta > Math.PI * 2) delta -= Math.PI * 2;
+  if (delta > Math.PI) delta = Math.PI * 2 - delta;
+  return delta * 180 / Math.PI;
+};
+const computeAngularDegreesCCW = (cx, cy, x1, y1, x2, y2) => {
+  const a1 = Math.atan2(y1 - cy, x1 - cx);
+  const a2 = Math.atan2(y2 - cy, x2 - cx);
+  let delta = a2 - a1;
+  while (delta < 0) delta += Math.PI * 2;
+  while (delta >= Math.PI * 2) delta -= Math.PI * 2;
+  return delta * 180 / Math.PI;
+};
+const computeDimensionMeasurement = (entity) => {
+  const x1 = entity.measureStart?.x ?? 0;
+  const y1 = entity.measureStart?.y ?? 0;
+  const x2 = entity.measureEnd?.x ?? 0;
+  const y2 = entity.measureEnd?.y ?? 0;
+  switch (entity.dimensionType) {
+    case 0:
+    case 1:
+    case 6: {
+      const dist = computeLinearDistance(x1, y1, x2, y2);
+      return formatDimensionValue(dist);
+    }
+    case 3: {
+      const dist = computeLinearDistance(x1, y1, x2, y2);
+      if (dist > 0) return formatDimensionValue(dist);
+      const radius = computeRadiusFallback(entity);
+      return formatDimensionValue(radius * 2);
+    }
+    case 4: {
+      const dist = computeLinearDistance(x1, y1, x2, y2);
+      if (dist > 0) return formatDimensionValue(dist);
+      const radius = computeRadiusFallback(entity);
+      return formatDimensionValue(radius);
+    }
+    case 2: {
+      const cx = entity.start?.x ?? 0;
+      const cy = entity.start?.y ?? 0;
+      const degrees = computeAngularDegreesMinimal(cx, cy, x1, y1, x2, y2);
+      const formatted = formatDimensionValue(degrees);
+      return formatted ? `${formatted}\xB0` : "";
+    }
+    case 5: {
+      const cx = entity.angleVertex?.x ?? 0;
+      const cy = entity.angleVertex?.y ?? 0;
+      const degrees = computeAngularDegreesCCW(cx, cy, x1, y1, x2, y2);
+      const formatted = formatDimensionValue(degrees);
+      return formatted ? `${formatted}\xB0` : "";
+    }
+    default:
+      return "";
+  }
+};
+const resolveDimensionText = (entity) => {
+  const raw = typeof entity.text === "string" ? entity.text : "";
+  const trimmed = raw.trim();
+  const measured = computeDimensionMeasurement(entity);
+  if (!trimmed) return measured;
+  if (trimmed.includes("<>")) {
+    return trimmed.split("<>").join(measured);
+  }
+  return trimmed;
+};
+const expandBBoxForMarker = (bbox, x, y, size) => {
+  bbox.expandByPoint({ x: x - size, y: y - size });
+  bbox.expandByPoint({ x: x + size, y: y + size });
+};
+const expandBBoxForText = (bbox, x, y, height, content) => {
+  const textWidth = content.length * height * 0.6;
+  bbox.expandByPoint({ x: x - textWidth / 2, y: y - height });
+  bbox.expandByPoint({ x: x + textWidth / 2, y: y + height });
+};
 function colorNumberToSVG(colorNumber) {
   if (colorNumber === void 0 || colorNumber < 0) {
     return "currentColor";
@@ -22,38 +184,117 @@ function getDimensionColors(dimStyle) {
     extLineWeight: dimStyle?.dimLwe ?? 0.5
   };
 }
-function dimensionToSVG(entity, dimStyle) {
+function dimensionToSVG(entity, dimStyle, options, viewport) {
   switch (entity.dimensionType) {
     case 0:
     // Rotated, horizontal, or vertical
     case 1:
-      return renderLinearDimension(entity, dimStyle);
+      return renderLinearDimension(entity, dimStyle, options, viewport);
     case 2:
-      return renderAngularDimension(entity, dimStyle);
+      return renderAngularDimension(entity, dimStyle, options, viewport);
+    case 5:
+      return renderAngular3PointDimension(entity, dimStyle, options, viewport);
     case 3:
-      return renderDiameterDimension(entity, dimStyle);
+      return renderDiameterDimension(entity, dimStyle, options, viewport);
     case 4:
-      return renderRadialDimension(entity, dimStyle);
+      return renderRadialDimension(entity, dimStyle, options, viewport);
     case 6:
-      return renderOrdinateDimension(entity, dimStyle);
+      return renderOrdinateDimension(entity, dimStyle, options, viewport);
     default:
       return renderFallbackDimension(entity);
   }
 }
-function createArrowMarker(id, size, color) {
-  const arrowPath = `M 0 0 L ${size} ${size / 2} L 0 ${size} z`;
-  return `<marker id="${id}" markerWidth="${size}" markerHeight="${size}" refX="${size}" refY="${size / 2}" orient="auto" markerUnits="strokeWidth">
+function renderAngular3PointDimension(entity, dimStyle, options, viewport) {
+  const bbox = new Box2();
+  const elements = [];
+  const markers = [];
+  const { arrowSize, textHeight } = getScaledDimensionSizes(dimStyle, options, viewport);
+  const { dimLineColor, extLineColor, textColor, dimLineWeight, extLineWeight } = getDimensionColors(dimStyle);
+  const vertexX = entity.angleVertex?.x ?? 0;
+  const vertexY = entity.angleVertex?.y ?? 0;
+  const x1 = entity.measureStart?.x ?? 0;
+  const y1 = entity.measureStart?.y ?? 0;
+  const x2 = entity.measureEnd?.x ?? 0;
+  const y2 = entity.measureEnd?.y ?? 0;
+  const startArcX = entity.start?.x ?? 0;
+  const startArcY = entity.start?.y ?? 0;
+  const arcPointX = entity.arcPoint?.x;
+  const arcPointY = entity.arcPoint?.y;
+  const arcPointRadius = Number.isFinite(arcPointX) && Number.isFinite(arcPointY) ? Math.hypot(arcPointX - vertexX, arcPointY - vertexY) : Number.NaN;
+  const useArcPoint = Number.isFinite(arcPointRadius) && arcPointRadius > 1e-9;
+  const arcLocationX = useArcPoint ? arcPointX : startArcX;
+  const arcLocationY = useArcPoint ? arcPointY : startArcY;
+  const textX = entity.textMidpoint?.x ?? arcLocationX;
+  const textY = entity.textMidpoint?.y ?? arcLocationY;
+  bbox.expandByPoint({ x: vertexX, y: vertexY });
+  bbox.expandByPoint({ x: x1, y: y1 });
+  bbox.expandByPoint({ x: x2, y: y2 });
+  bbox.expandByPoint({ x: arcLocationX, y: arcLocationY });
+  bbox.expandByPoint({ x: textX, y: textY });
+  const a1 = Math.atan2(y1 - vertexY, x1 - vertexX);
+  const a2 = Math.atan2(y2 - vertexY, x2 - vertexX);
+  let radius = Math.hypot(arcLocationX - vertexX, arcLocationY - vertexY);
+  if (!Number.isFinite(radius) || radius <= 1e-9) {
+    radius = Math.hypot(textX - vertexX, textY - vertexY);
+  }
+  if (!Number.isFinite(radius) || radius <= 1e-9) {
+    radius = Math.max(
+      Math.hypot(x1 - vertexX, y1 - vertexY),
+      Math.hypot(x2 - vertexX, y2 - vertexY)
+    );
+  }
+  const arcStartX = vertexX + radius * Math.cos(a1);
+  const arcStartY = vertexY + radius * Math.sin(a1);
+  const arcEndX = vertexX + radius * Math.cos(a2);
+  const arcEndY = vertexY + radius * Math.sin(a2);
+  bbox.expandByPoint({ x: arcStartX, y: arcStartY });
+  bbox.expandByPoint({ x: arcEndX, y: arcEndY });
+  const markerId1 = `dim-angular-3p-arrow-start-${Date.now()}`;
+  const markerId2 = `dim-angular-3p-arrow-end-${Date.now()}`;
+  markers.push(
+    createArrowMarker(markerId1, arrowSize, dimLineColor, "backward"),
+    createArrowMarker(markerId2, arrowSize, dimLineColor, "forward")
+  );
+  elements.push(
+    `<line x1="${x1}" y1="${y1}" x2="${arcStartX}" y2="${arcStartY}" stroke="${extLineColor}" stroke-width="${extLineWeight}" />`,
+    `<line x1="${x2}" y1="${y2}" x2="${arcEndX}" y2="${arcEndY}" stroke="${extLineColor}" stroke-width="${extLineWeight}" />`
+  );
+  let delta = a2 - a1;
+  while (delta < 0) delta += Math.PI * 2;
+  while (delta >= Math.PI * 2) delta -= Math.PI * 2;
+  const largeArcFlag = delta > Math.PI ? 1 : 0;
+  const sweepFlag = 1;
+  expandBBoxForMarker(bbox, arcStartX, arcStartY, arrowSize);
+  expandBBoxForMarker(bbox, arcEndX, arcEndY, arrowSize);
+  elements.push(
+    `<path d="M ${arcStartX} ${arcStartY} A ${radius} ${radius} 0 ${largeArcFlag} ${sweepFlag} ${arcEndX} ${arcEndY}" fill="none" stroke="${dimLineColor}" stroke-width="${dimLineWeight}" marker-start="url(#${markerId1})" marker-end="url(#${markerId2})" />`
+  );
+  const resolvedText = resolveDimensionText(entity);
+  if (resolvedText) {
+    const midAngle = a1 + delta / 2;
+    const textRotation = midAngle * 180 / Math.PI;
+    expandBBoxForText(bbox, textX, textY, textHeight, resolvedText);
+    elements.push(
+      `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${escapeXmlText(resolvedText)}</text>`
+    );
+  }
+  return {
+    bbox,
+    element: `<defs>${markers.join("")}</defs><g>${elements.join("")}</g>`
+  };
+}
+function createArrowMarker(id, size, color, direction = "forward") {
+  const arrowPath = direction === "forward" ? `M 0 0 L ${size} ${size / 2} L 0 ${size} z` : `M ${size} 0 L 0 ${size / 2} L ${size} ${size} z`;
+  const refX = direction === "forward" ? size : 0;
+  return `<marker id="${id}" markerWidth="${size}" markerHeight="${size}" refX="${refX}" refY="${size / 2}" orient="auto" markerUnits="userSpaceOnUse">
     <path d="${arrowPath}" fill="${color}" />
   </marker>`;
 }
-function renderLinearDimension(entity, dimStyle) {
+function renderLinearDimension(entity, dimStyle, options, viewport) {
   const bbox = new Box2();
   const elements = [];
   const markers = [];
-  const arrowSize = dimStyle?.dimAsz ?? 2.5;
-  const textHeight = dimStyle?.dimTxt ?? 2.5;
-  const extLineOffset = dimStyle?.dimExo ?? 0.625;
-  const extLineExtension = dimStyle?.dimExe ?? 1.25;
+  const { arrowSize, textHeight, extLineOffset, extLineExtension } = getScaledDimensionSizes(dimStyle, options, viewport);
   const { dimLineColor, extLineColor, textColor, dimLineWeight, extLineWeight } = getDimensionColors(dimStyle);
   const defPoint1X = entity.measureStart?.x ?? 0;
   const defPoint1Y = entity.measureStart?.y ?? 0;
@@ -76,8 +317,8 @@ function renderLinearDimension(entity, dimStyle) {
   const markerId1 = `dim-arrow-start-${Date.now()}`;
   const markerId2 = `dim-arrow-end-${Date.now()}`;
   markers.push(
-    createArrowMarker(markerId1, arrowSize, dimLineColor),
-    createArrowMarker(markerId2, arrowSize, dimLineColor)
+    createArrowMarker(markerId1, arrowSize, dimLineColor, "backward"),
+    createArrowMarker(markerId2, arrowSize, dimLineColor, "forward")
   );
   const extLine1StartX = defPoint1X + Math.cos(perpAngle) * extLineOffset;
   const extLine1StartY = defPoint1Y + Math.sin(perpAngle) * extLineOffset;
@@ -87,15 +328,23 @@ function renderLinearDimension(entity, dimStyle) {
   const extLine2StartY = defPoint2Y + Math.sin(perpAngle) * extLineOffset;
   const extLine2EndX = dimLine2X + Math.cos(perpAngle) * extLineExtension;
   const extLine2EndY = dimLine2Y + Math.sin(perpAngle) * extLineExtension;
+  bbox.expandByPoint({ x: extLine1StartX, y: extLine1StartY });
+  bbox.expandByPoint({ x: extLine1EndX, y: extLine1EndY });
+  bbox.expandByPoint({ x: extLine2StartX, y: extLine2StartY });
+  bbox.expandByPoint({ x: extLine2EndX, y: extLine2EndY });
+  expandBBoxForMarker(bbox, dimLine1X, dimLine1Y, arrowSize);
+  expandBBoxForMarker(bbox, dimLine2X, dimLine2Y, arrowSize);
   elements.push(
     `<line x1="${extLine1StartX}" y1="${extLine1StartY}" x2="${extLine1EndX}" y2="${extLine1EndY}" stroke="${extLineColor}" stroke-width="${extLineWeight}" />`,
     `<line x1="${extLine2StartX}" y1="${extLine2StartY}" x2="${extLine2EndX}" y2="${extLine2EndY}" stroke="${extLineColor}" stroke-width="${extLineWeight}" />`,
     `<line x1="${dimLine1X}" y1="${dimLine1Y}" x2="${dimLine2X}" y2="${dimLine2Y}" stroke="${dimLineColor}" stroke-width="${dimLineWeight}" marker-start="url(#${markerId1})" marker-end="url(#${markerId2})" />`
   );
-  if (entity.text) {
+  const resolvedText = resolveDimensionText(entity);
+  if (resolvedText) {
     const textRotation = angle * 180 / Math.PI;
+    expandBBoxForText(bbox, textX, textY, textHeight, resolvedText);
     elements.push(
-      `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${entity.text}</text>`
+      `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${escapeXmlText(resolvedText)}</text>`
     );
   }
   return {
@@ -103,12 +352,11 @@ function renderLinearDimension(entity, dimStyle) {
     element: `<defs>${markers.join("")}</defs><g>${elements.join("")}</g>`
   };
 }
-function renderAngularDimension(entity, dimStyle) {
+function renderAngularDimension(entity, dimStyle, options, viewport) {
   const bbox = new Box2();
   const elements = [];
   const markers = [];
-  const arrowSize = dimStyle?.dimAsz ?? 2.5;
-  const textHeight = dimStyle?.dimTxt ?? 2.5;
+  const { arrowSize, textHeight } = getScaledDimensionSizes(dimStyle, options, viewport);
   const { dimLineColor, extLineColor, textColor, dimLineWeight, extLineWeight } = getDimensionColors(dimStyle);
   const centerX = entity.start?.x ?? 0;
   const centerY = entity.start?.y ?? 0;
@@ -125,8 +373,8 @@ function renderAngularDimension(entity, dimStyle) {
   const markerId1 = `dim-angular-arrow-start-${Date.now()}`;
   const markerId2 = `dim-angular-arrow-end-${Date.now()}`;
   markers.push(
-    createArrowMarker(markerId1, arrowSize, dimLineColor),
-    createArrowMarker(markerId2, arrowSize, dimLineColor)
+    createArrowMarker(markerId1, arrowSize, dimLineColor, "backward"),
+    createArrowMarker(markerId2, arrowSize, dimLineColor, "forward")
   );
   elements.push(
     `<line x1="${centerX}" y1="${centerY}" x2="${x1}" y2="${y1}" stroke="${extLineColor}" stroke-width="${extLineWeight}" />`,
@@ -143,11 +391,13 @@ function renderAngularDimension(entity, dimStyle) {
   elements.push(
     `<path d="M ${arcStartX} ${arcStartY} A ${radius} ${radius} 0 ${largeArcFlag} 1 ${arcEndX} ${arcEndY}" fill="none" stroke="${dimLineColor}" stroke-width="${dimLineWeight}" marker-start="url(#${markerId1})" marker-end="url(#${markerId2})" />`
   );
-  if (entity.text) {
+  const resolvedText = resolveDimensionText(entity);
+  if (resolvedText) {
     const midAngle = (startAngle + endAngle) / 2;
     const textRotation = midAngle * 180 / Math.PI;
+    expandBBoxForText(bbox, textX, textY, textHeight, resolvedText);
     elements.push(
-      `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${entity.text}</text>`
+      `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${escapeXmlText(resolvedText)}</text>`
     );
   }
   return {
@@ -155,12 +405,11 @@ function renderAngularDimension(entity, dimStyle) {
     element: `<defs>${markers.join("")}</defs><g>${elements.join("")}</g>`
   };
 }
-function renderDiameterDimension(entity, dimStyle) {
+function renderDiameterDimension(entity, dimStyle, options, viewport) {
   const bbox = new Box2();
   const elements = [];
   const markers = [];
-  const arrowSize = dimStyle?.dimAsz ?? 2.5;
-  const textHeight = dimStyle?.dimTxt ?? 2.5;
+  const { arrowSize, textHeight } = getScaledDimensionSizes(dimStyle, options, viewport);
   const { dimLineColor, textColor, dimLineWeight } = getDimensionColors(dimStyle);
   const x1 = entity.measureStart?.x ?? 0;
   const y1 = entity.measureStart?.y ?? 0;
@@ -171,28 +420,33 @@ function renderDiameterDimension(entity, dimStyle) {
   bbox.expandByPoint({ x: x1, y: y1 });
   bbox.expandByPoint({ x: x2, y: y2 });
   bbox.expandByPoint({ x: textX, y: textY });
-  const markerId = `dim-diameter-arrow-${Date.now()}`;
-  markers.push(createArrowMarker(markerId, arrowSize, dimLineColor));
-  elements.push(
-    `<line x1="${x1}" y1="${y1}" x2="${x2}" y2="${y2}" stroke="${dimLineColor}" stroke-width="${dimLineWeight}" marker-end="url(#${markerId})" />`
-  );
-  const diameterText = entity.text ? `\u2300${entity.text}` : "\u2300";
+  const diameterLen = Math.hypot(x2 - x1, y2 - y1);
+  if (Number.isFinite(diameterLen) && diameterLen > 1e-6) {
+    const markerId = `dim-diameter-arrow-${Date.now()}`;
+    markers.push(createArrowMarker(markerId, arrowSize, dimLineColor, "backward"));
+    elements.push(
+      `<line x1="${x1}" y1="${y1}" x2="${x2}" y2="${y2}" stroke="${dimLineColor}" stroke-width="${dimLineWeight}" marker-end="url(#${markerId})" />`
+    );
+    expandBBoxForMarker(bbox, x2, y2, arrowSize);
+  }
+  const resolvedText = resolveDimensionText(entity);
+  const diameterText = resolvedText ? `\u2300${resolvedText}` : "\u2300";
   const angle = Math.atan2(y2 - y1, x2 - x1);
   const textRotation = angle * 180 / Math.PI;
+  expandBBoxForText(bbox, textX, textY, textHeight, diameterText);
   elements.push(
-    `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${diameterText}</text>`
+    `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${escapeXmlText(diameterText)}</text>`
   );
   return {
     bbox,
     element: `<defs>${markers.join("")}</defs><g>${elements.join("")}</g>`
   };
 }
-function renderRadialDimension(entity, dimStyle) {
+function renderRadialDimension(entity, dimStyle, options, viewport) {
   const bbox = new Box2();
   const elements = [];
   const markers = [];
-  const arrowSize = dimStyle?.dimAsz ?? 2.5;
-  const textHeight = dimStyle?.dimTxt ?? 2.5;
+  const { arrowSize, textHeight } = getScaledDimensionSizes(dimStyle, options, viewport);
   const { dimLineColor, textColor, dimLineWeight } = getDimensionColors(dimStyle);
   const x1 = entity.measureStart?.x ?? 0;
   const y1 = entity.measureStart?.y ?? 0;
@@ -203,26 +457,32 @@ function renderRadialDimension(entity, dimStyle) {
   bbox.expandByPoint({ x: x1, y: y1 });
   bbox.expandByPoint({ x: x2, y: y2 });
   bbox.expandByPoint({ x: textX, y: textY });
-  const markerId = `dim-radius-arrow-${Date.now()}`;
-  markers.push(createArrowMarker(markerId, arrowSize, dimLineColor));
-  elements.push(
-    `<line x1="${x1}" y1="${y1}" x2="${x2}" y2="${y2}" stroke="${dimLineColor}" stroke-width="${dimLineWeight}" marker-end="url(#${markerId})" />`
-  );
-  const radiusText = entity.text ? `R${entity.text}` : "R";
+  const radiusLen = Math.hypot(x2 - x1, y2 - y1);
+  if (Number.isFinite(radiusLen) && radiusLen > 1e-6) {
+    const markerId = `dim-radius-arrow-${Date.now()}`;
+    markers.push(createArrowMarker(markerId, arrowSize, dimLineColor, "backward"));
+    elements.push(
+      `<line x1="${x1}" y1="${y1}" x2="${x2}" y2="${y2}" stroke="${dimLineColor}" stroke-width="${dimLineWeight}" marker-end="url(#${markerId})" />`
+    );
+    expandBBoxForMarker(bbox, x2, y2, arrowSize);
+  }
+  const resolvedText = resolveDimensionText(entity);
+  const radiusText = resolvedText ? `R${resolvedText}` : "R";
   const angle = Math.atan2(y2 - y1, x2 - x1);
   const textRotation = angle * 180 / Math.PI;
+  expandBBoxForText(bbox, textX, textY, textHeight, radiusText);
   elements.push(
-    `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${radiusText}</text>`
+    `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${escapeXmlText(radiusText)}</text>`
   );
   return {
     bbox,
     element: `<defs>${markers.join("")}</defs><g>${elements.join("")}</g>`
   };
 }
-function renderOrdinateDimension(entity, dimStyle) {
+function renderOrdinateDimension(entity, dimStyle, options, viewport) {
   const bbox = new Box2();
   const elements = [];
-  const textHeight = dimStyle?.dimTxt ?? 2.5;
+  const { textHeight } = getScaledDimensionSizes(dimStyle, options, viewport);
   const { dimLineColor, textColor, dimLineWeight } = getDimensionColors(dimStyle);
   const x1 = entity.measureStart?.x ?? 0;
   const y1 = entity.measureStart?.y ?? 0;
@@ -236,11 +496,13 @@ function renderOrdinateDimension(entity, dimStyle) {
   elements.push(
     `<line x1="${x1}" y1="${y1}" x2="${x2}" y2="${y2}" stroke="${dimLineColor}" stroke-width="${dimLineWeight}" />`
   );
-  if (entity.text) {
+  const resolvedText = resolveDimensionText(entity);
+  if (resolvedText) {
     const angle = Math.atan2(y2 - y1, x2 - x1);
     const textRotation = angle * 180 / Math.PI;
+    expandBBoxForText(bbox, textX, textY, textHeight, resolvedText);
     elements.push(
-      `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${entity.text}</text>`
+      `<text x="${textX}" y="${textY}" font-size="${textHeight}" fill="${textColor}" text-anchor="middle" transform="rotate(${-textRotation} ${textX} ${textY}) scale(1,-1) translate(0 ${-2 * textY})">${escapeXmlText(resolvedText)}</text>`
     );
   }
   return {
@@ -255,9 +517,10 @@ function renderFallbackDimension(entity) {
     const textX = entity.textMidpoint.x ?? 0;
     const textY = entity.textMidpoint.y ?? 0;
     bbox.expandByPoint({ x: textX, y: textY });
-    if (entity.text) {
+    const resolvedText = resolveDimensionText(entity);
+    if (resolvedText) {
       elements.push(
-        `<text x="${textX}" y="${textY}" font-size="2.5" text-anchor="middle" transform="scale(1,-1) translate(0 ${-2 * textY})">${entity.text}</text>`
+        `<text x="${textX}" y="${textY}" font-size="2.5" text-anchor="middle" transform="scale(1,-1) translate(0 ${-2 * textY})">${escapeXmlText(resolvedText)}</text>`
       );
     }
   }
@@ -268,6 +531,7 @@ function renderFallbackDimension(entity) {
 }
 export {
   createArrowMarker,
-  dimensionToSVG as default
+  dimensionToSVG as default,
+  getDimensionGeometryBBox
 };
 //# sourceMappingURL=dimensionToSVG.js.map