fix for min size for more shapes

This commit is contained in:
Ashish Jain
2024-10-01 23:45:32 +02:00
parent eb346e1c51
commit f1674b8b04
8 changed files with 54 additions and 50 deletions

View File

@@ -103,21 +103,21 @@ export const bowTieRect = async (parent: SVGAElement, node: Node) => {
// also check if the width or height is less than minimum default values (50),
// if so set it to min value
if (node.width || node.height) {
node.height = Math.max((node?.height ?? 0) - labelPaddingY * 2, 50);
node.height = Math.max((node?.height ?? 0) - labelPaddingY * 2, 10);
const totalHeight = calcTotalHeight(node.height);
const [rx, ry] = calcEllipseRadius(totalHeight);
node.width = Math.max(
(node?.width ?? 0) - labelPaddingX * 2 - calculateArcSagitta(totalHeight, rx, ry),
50
10
);
}
const { shapeSvg, bbox } = await labelHelper(parent, node, getNodeClasses(node));
const totalHeight = calcTotalHeight(Math.max(bbox.height, node?.height ?? 0));
const totalHeight = calcTotalHeight(node?.height ? node?.height : bbox.height);
const [rx, ry] = calcEllipseRadius(totalHeight);
const sagitta = calculateArcSagitta(totalHeight, rx, ry);
const totalWidth = Math.max(bbox.width, node?.width ?? 0) + labelPaddingX * 2 + sagitta;
const totalWidth = (node?.width ? node?.width : bbox.width) + labelPaddingX * 2 + sagitta;
const w = totalWidth - sagitta;
const h = totalHeight;

View File

@@ -25,7 +25,7 @@ export const crossedCircle = (parent: SVG, node: Node) => {
.insert('g')
.attr('class', getNodeClasses(node))
.attr('id', node.domId ?? node.id);
const radius = Math.max(25, (node?.width ?? 0) / 2, (node?.height ?? 0) / 2);
const radius = node?.width ? node?.width / 2 : node?.height ? node?.height / 2 : 25;
const { cssStyles } = node;
// @ts-ignore - rough is not typed

View File

@@ -6,8 +6,8 @@ import { styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
import rough from 'roughjs';
import { createPathFromPoints } from './util.js';
const MIN_HEIGHT = 25;
const MIN_WIDTH = 25;
const MIN_HEIGHT = 10;
const MIN_WIDTH = 10;
export const flippedTriangle = async (parent: SVGAElement, node: Node): Promise<SVGAElement> => {
const { labelStyles, nodeStyles } = styles2String(node);
node.labelStyle = labelStyles;
@@ -15,24 +15,24 @@ export const flippedTriangle = async (parent: SVGAElement, node: Node): Promise<
const nodePadding = node.padding ?? 0;
const labelPaddingX = node.look === 'neo' ? nodePadding * 2 : nodePadding;
const labelPaddingY = node.look === 'neo' ? nodePadding * 1 : nodePadding;
if (node.width || node.height) {
node.height = node?.height ?? 0;
if (node.height < MIN_HEIGHT) {
node.height = MIN_HEIGHT;
}
node.width = node?.width ?? 0 - labelPaddingX * 4;
node.width = (node?.width ?? 0) - labelPaddingX - labelPaddingX / 2;
if (node.width < MIN_WIDTH) {
node.width = MIN_WIDTH;
}
}
const { shapeSvg, bbox, label } = await labelHelper(parent, node, getNodeClasses(node));
const w = Math.max(bbox.width, node?.width ?? 0) + (labelPaddingX ?? 0);
const h = Math.max(w + bbox.height, node?.width ?? 0);
const w = (node?.width ? node?.width : bbox.width) + (labelPaddingX ?? 0);
const h = node?.height ? node?.height : w + bbox.height;
const tw = w + bbox.height;
const points = [
{ x: 0, y: -h },
{ x: tw, y: -h },

View File

@@ -16,25 +16,25 @@ export const linedWaveEdgedRect = async (parent: SVGAElement, node: Node) => {
const nodePadding = node.padding ?? 0;
const labelPaddingX = node.look === 'neo' ? nodePadding * 2 : (node.padding ?? 0);
const labelPaddingY = node.look === 'neo' ? nodePadding * 2 : (node.padding ?? 0);
let adjustFinalHeight = true;
if (node.width || node.height) {
adjustFinalHeight = false;
node.width = (node?.width ?? 0) - labelPaddingX * 2;
if (node.width < 50) {
node.width = 50;
const originalWidth = node.width;
node.width = ((originalWidth ?? 0) * 10) / 11 - labelPaddingX * 2;
if (node.width < 10) {
node.width = 10;
}
const originalHeight = node.height;
node.height = (node?.height ?? 0) - labelPaddingY * 2;
if (node.height < 50) {
node.height = 50;
node.height = ((originalHeight ?? 0) * 3) / 4 - labelPaddingY * 2;
//node.height = (node?.height ?? 0) - labelPaddingY * 2;
if (node.height < 10) {
node.height = 10;
}
}
const { shapeSvg, bbox, label } = await labelHelper(parent, node, getNodeClasses(node));
const w = Math.max(bbox.width, node?.width ?? 0) + (labelPaddingX ?? 0) * 2;
const h = Math.max(bbox.height, node?.height ?? 0) + (labelPaddingY ?? 0) * 2;
const w = (node?.width ? node?.width : bbox.width) + (labelPaddingX ?? 0) * 2;
const h = (node?.height ? node?.height : bbox.height) + (labelPaddingY ?? 0) * 2;
const waveAmplitude = h / 6;
const finalH = h + (adjustFinalHeight ? waveAmplitude : -waveAmplitude);
const finalH = h + waveAmplitude;
const { cssStyles } = node;
// @ts-ignore - rough is not typed

View File

@@ -17,14 +17,15 @@ export const multiRect = async (parent: SVGAElement, node: Node) => {
// also check if the width or height is less than minimum default values (50),
// if so set it to min value
if (node.width || node.height) {
node.width = Math.max((node?.width ?? 0) - labelPaddingX * 2 - 2 * rectOffset, 50);
node.height = Math.max((node?.height ?? 0) - labelPaddingY * 2 - 2 * rectOffset, 50);
node.width = Math.max((node?.width ?? 0) - labelPaddingX * 2 - 2 * rectOffset, 10);
node.height = Math.max((node?.height ?? 0) - labelPaddingY * 2 - 2 * rectOffset, 10);
}
const { shapeSvg, bbox, label } = await labelHelper(parent, node, getNodeClasses(node));
const totalWidth = Math.max(bbox.width, node?.width ?? 0) + labelPaddingX * 2 + 2 * rectOffset;
const totalHeight = Math.max(bbox.height, node?.height ?? 0) + labelPaddingY * 2 + 2 * rectOffset;
const totalWidth = (node?.width ? node?.width : bbox.width) + labelPaddingX * 2 + 2 * rectOffset;
const totalHeight =
(node?.height ? node?.height : bbox.height) + labelPaddingY * 2 + 2 * rectOffset;
const w = totalWidth - 2 * rectOffset;
const h = totalHeight - 2 * rectOffset;

View File

@@ -16,14 +16,14 @@ export const slopedRect = async (parent: SVGAElement, node: Node) => {
// also check if the width or height is less than minimum default values (50),
// if so set it to min value
if (node.width || node.height) {
node.width = Math.max((node?.width ?? 0) - labelPaddingX * 2, 50);
node.height = Math.max((node?.height ?? 0) / 1.5 - labelPaddingY * 2, 50);
node.width = Math.max((node?.width ?? 0) - labelPaddingX * 2, 10);
node.height = Math.max((node?.height ?? 0) / 1.5 - labelPaddingY * 2, 10);
}
const { shapeSvg, bbox, label } = await labelHelper(parent, node, getNodeClasses(node));
const totalWidth = Math.max(bbox.width, node?.width ?? 0) + labelPaddingX * 2;
const totalHeight = (Math.max(bbox.height, node?.height ?? 0) + labelPaddingY * 2) * 1.5;
const totalWidth = (node?.width ? node?.width : bbox.width) + labelPaddingX * 2;
const totalHeight = ((node?.height ? node?.height : bbox.height) + labelPaddingY * 2) * 1.5;
const w = totalWidth;
const h = totalHeight / 1.5;

View File

@@ -10,8 +10,8 @@ export const trapezoidalPentagon = async (parent: SVGAElement, node: Node) => {
const nodePadding = node.padding ?? 0;
const labelPaddingX = node.look === 'neo' ? nodePadding * 2 : nodePadding;
const labelPaddingY = node.look === 'neo' ? nodePadding * 1 : nodePadding;
const minWidth = 60,
minHeight = 20;
const minWidth = 15,
minHeight = 5;
if (node.width || node.height) {
node.height = (node.height ?? 0) - labelPaddingY * 2;
if (node.height < minHeight) {
@@ -26,8 +26,9 @@ export const trapezoidalPentagon = async (parent: SVGAElement, node: Node) => {
const { shapeSvg, bbox } = await labelHelper(parent, node, getNodeClasses(node));
const w = Math.max(minWidth, bbox.width, node?.width ?? 0) + (labelPaddingX ?? 0) * 2;
const h = Math.max(minHeight, bbox.height, node?.height ?? 0) + (labelPaddingY ?? 0) * 2;
const w = (node?.width ? node?.width : Math.max(minWidth, bbox.width)) + (labelPaddingX ?? 0) * 2;
const h =
(node?.height ? node?.height : Math.max(minHeight, bbox.height)) + (labelPaddingY ?? 0) * 2;
const { cssStyles } = node;
// @ts-ignore - rough is not typed