5071601472

Build Type

push

github

Committed by Knut Sveidqvist

Commit Message

Merge branch 'release/10.2.0'

Run Details

1633 of 2064 branches covered (79.12%)

Branch coverage included in aggregate %.

2701 of 2701 new or added lines in 128 files covered. (100.0%)

19402 of 34929 relevant lines covered (55.55%)

418.23 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

12.14

/packages/mermaid/src/diagrams/quadrant-chart/quadrantRenderer.ts

// @ts-ignore: TODO Fix ts errors
import { select } from 'd3';
import * as configApi from '../../config.js';
import { log } from '../../logger.js';
import { configureSvgSize } from '../../setupGraphViewbox.js';
import { Diagram } from '../../Diagram.js';
import {
  QuadrantBuildType,
  QuadrantLineType,
  QuadrantPointType,
  QuadrantQuadrantsType,
  QuadrantTextType,
  TextHorizontalPos,
  TextVerticalPos,
} from './quadrantBuilder.js';

export const draw = (txt: string, id: string, _version: string, diagObj: Diagram) => {
  function getDominantBaseLine(horizontalPos: TextHorizontalPos) {
    return horizontalPos === 'top' ? 'hanging' : 'middle';
  }

  function getTextAnchor(verticalPos: TextVerticalPos) {
    return verticalPos === 'left' ? 'start' : 'middle';
  }

  function getTransformation(data: { x: number; y: number; rotation: number }) {
    return `translate(${data.x}, ${data.y}) rotate(${data.rotation || 0})`;
  }

  const conf = configApi.getConfig();

  log.debug('Rendering quadrant chart\n' + txt);

  const securityLevel = conf.securityLevel;
  // Handle root and Document for when rendering in sandbox mode
  let sandboxElement;
  if (securityLevel === 'sandbox') {
    sandboxElement = select('#i' + id);
  }
  const root =
    securityLevel === 'sandbox'
      ? select(sandboxElement.nodes()[0].contentDocument.body)
      : select('body');

  const svg = root.select(`[id="${id}"]`);

  const group = svg.append('g').attr('class', 'main');

  const width = conf.quadrantChart?.chartWidth || 500;
  const height = conf.quadrantChart?.chartHeight || 500;

  configureSvgSize(svg, height, width, conf.quadrantChart?.useMaxWidth || true);

  svg.attr('viewBox', '0 0 ' + width + ' ' + height);

  // @ts-ignore: TODO Fix ts errors
  diagObj.db.setHeight(height);
  // @ts-ignore: TODO Fix ts errors
  diagObj.db.setWidth(width);

  // @ts-ignore: TODO Fix ts errors
  const quadrantData: QuadrantBuildType = diagObj.db.getQuadrantData();

  const quadrantsGroup = group.append('g').attr('class', 'quadrants');
  const borderGroup = group.append('g').attr('class', 'border');
  const dataPointGroup = group.append('g').attr('class', 'data-points');
  const labelGroup = group.append('g').attr('class', 'labels');
  const titleGroup = group.append('g').attr('class', 'title');

  if (quadrantData.title) {
    titleGroup
      .append('text')
      .attr('x', 0)
      .attr('y', 0)
      .attr('fill', quadrantData.title.fill)
      .attr('font-size', quadrantData.title.fontSize)
      .attr('dominant-baseline', getDominantBaseLine(quadrantData.title.horizontalPos))
      .attr('text-anchor', getTextAnchor(quadrantData.title.verticalPos))
      .attr('transform', getTransformation(quadrantData.title))
      .text(quadrantData.title.text);
  }

  if (quadrantData.borderLines) {
    borderGroup
      .selectAll('line')
      .data(quadrantData.borderLines)
      .enter()
      .append('line')
      .attr('x1', (data: QuadrantLineType) => data.x1)
      .attr('y1', (data: QuadrantLineType) => data.y1)
      .attr('x2', (data: QuadrantLineType) => data.x2)
      .attr('y2', (data: QuadrantLineType) => data.y2)
      .style('stroke', (data: QuadrantLineType) => data.strokeFill)
      .style('stroke-width', (data: QuadrantLineType) => data.strokeWidth);
  }

  const quadrants = quadrantsGroup
    .selectAll('g.quadrant')
    .data(quadrantData.quadrants)
    .enter()
    .append('g')
    .attr('class', 'quadrant');

  quadrants
    .append('rect')
    .attr('x', (data: QuadrantQuadrantsType) => data.x)
    .attr('y', (data: QuadrantQuadrantsType) => data.y)
    .attr('width', (data: QuadrantQuadrantsType) => data.width)
    .attr('height', (data: QuadrantQuadrantsType) => data.height)
    .attr('fill', (data: QuadrantQuadrantsType) => data.fill);

  quadrants
    .append('text')
    .attr('x', 0)
    .attr('y', 0)
    .attr('fill', (data: QuadrantQuadrantsType) => data.text.fill)
    .attr('font-size', (data: QuadrantQuadrantsType) => data.text.fontSize)
    .attr('dominant-baseline', (data: QuadrantQuadrantsType) =>
      getDominantBaseLine(data.text.horizontalPos)
    )
    .attr('text-anchor', (data: QuadrantQuadrantsType) => getTextAnchor(data.text.verticalPos))
    .attr('transform', (data: QuadrantQuadrantsType) => getTransformation(data.text))
    .text((data: QuadrantQuadrantsType) => data.text.text);

  const labels = labelGroup
    .selectAll('g.label')
    .data(quadrantData.axisLabels)
    .enter()
    .append('g')
    .attr('class', 'label');

  labels
    .append('text')
    .attr('x', 0)
    .attr('y', 0)
    .text((data: QuadrantTextType) => data.text)
    .attr('fill', (data: QuadrantTextType) => data.fill)
    .attr('font-size', (data: QuadrantTextType) => data.fontSize)
    .attr('dominant-baseline', (data: QuadrantTextType) => getDominantBaseLine(data.horizontalPos))
    .attr('text-anchor', (data: QuadrantTextType) => getTextAnchor(data.verticalPos))
    .attr('transform', (data: QuadrantTextType) => getTransformation(data));

  const dataPoints = dataPointGroup
    .selectAll('g.data-point')
    .data(quadrantData.points)
    .enter()
    .append('g')
    .attr('class', 'data-point');

  dataPoints
    .append('circle')
    .attr('cx', (data: QuadrantPointType) => data.x)
    .attr('cy', (data: QuadrantPointType) => data.y)
    .attr('r', (data: QuadrantPointType) => data.radius)
    .attr('fill', (data: QuadrantPointType) => data.fill);

  dataPoints
    .append('text')
    .attr('x', 0)
    .attr('y', 0)
    .text((data: QuadrantPointType) => data.text.text)
    .attr('fill', (data: QuadrantPointType) => data.text.fill)
    .attr('font-size', (data: QuadrantPointType) => data.text.fontSize)
    .attr('dominant-baseline', (data: QuadrantPointType) =>
      getDominantBaseLine(data.text.horizontalPos)
    )
    .attr('text-anchor', (data: QuadrantPointType) => getTextAnchor(data.text.verticalPos))
    .attr('transform', (data: QuadrantPointType) => getTransformation(data.text));
};

export default {
  draw,
};

1	// @ts-ignore: TODO Fix ts errors	1✔
2	import { select } from 'd3';	1✔
3	import * as configApi from '../../config.js';	1✔
4	import { log } from '../../logger.js';	1✔
5	import { configureSvgSize } from '../../setupGraphViewbox.js';	1✔
6	import { Diagram } from '../../Diagram.js';	1✔
7	import {	1✔
8	QuadrantBuildType,	1✔
9	QuadrantLineType,	1✔
10	QuadrantPointType,	1✔
11	QuadrantQuadrantsType,	1✔
12	QuadrantTextType,	1✔
13	TextHorizontalPos,	1✔
14	TextVerticalPos,	1✔
15	} from './quadrantBuilder.js';	1✔
16		1✔
17	export const draw = (txt: string, id: string, _version: string, diagObj: Diagram) => {	1✔
18	function getDominantBaseLine(horizontalPos: TextHorizontalPos) {	×
19	return horizontalPos === 'top' ? 'hanging' : 'middle';	×
20	}	×
21		×
22	function getTextAnchor(verticalPos: TextVerticalPos) {	×
23	return verticalPos === 'left' ? 'start' : 'middle';	×
24	}	×
25		×
26	function getTransformation(data: { x: number; y: number; rotation: number }) {	×
27	return `translate(${data.x}, ${data.y}) rotate(${data.rotation \|\| 0})`;	×
28	}	×
29		×
30	const conf = configApi.getConfig();	×
31		×
32	log.debug('Rendering quadrant chart\n' + txt);	×
33		×
34	const securityLevel = conf.securityLevel;	×
35	// Handle root and Document for when rendering in sandbox mode	×
36	let sandboxElement;	×
37	if (securityLevel === 'sandbox') {	×
38	sandboxElement = select('#i' + id);	×
39	}	×
40	const root =	×
41	securityLevel === 'sandbox'	×
42	? select(sandboxElement.nodes()[0].contentDocument.body)	×
43	: select('body');	×
44		×
45	const svg = root.select(`[id="${id}"]`);	×
46		×
47	const group = svg.append('g').attr('class', 'main');	×
48		×
49	const width = conf.quadrantChart?.chartWidth \|\| 500;	×
50	const height = conf.quadrantChart?.chartHeight \|\| 500;	×
51		×
52	configureSvgSize(svg, height, width, conf.quadrantChart?.useMaxWidth \|\| true);	×
53		×
54	svg.attr('viewBox', '0 0 ' + width + ' ' + height);	×
55		×
56	// @ts-ignore: TODO Fix ts errors	×
57	diagObj.db.setHeight(height);	×
58	// @ts-ignore: TODO Fix ts errors	×
59	diagObj.db.setWidth(width);	×
60		×
61	// @ts-ignore: TODO Fix ts errors	×
62	const quadrantData: QuadrantBuildType = diagObj.db.getQuadrantData();	×
63		×
64	const quadrantsGroup = group.append('g').attr('class', 'quadrants');	×
65	const borderGroup = group.append('g').attr('class', 'border');	×
66	const dataPointGroup = group.append('g').attr('class', 'data-points');	×
67	const labelGroup = group.append('g').attr('class', 'labels');	×
68	const titleGroup = group.append('g').attr('class', 'title');	×
69		×
70	if (quadrantData.title) {	×
71	titleGroup	×
72	.append('text')	×
73	.attr('x', 0)	×
74	.attr('y', 0)	×
75	.attr('fill', quadrantData.title.fill)	×
76	.attr('font-size', quadrantData.title.fontSize)	×
77	.attr('dominant-baseline', getDominantBaseLine(quadrantData.title.horizontalPos))	×
78	.attr('text-anchor', getTextAnchor(quadrantData.title.verticalPos))	×
79	.attr('transform', getTransformation(quadrantData.title))	×
80	.text(quadrantData.title.text);	×
81	}	×
82		×
83	if (quadrantData.borderLines) {	×
84	borderGroup	×
85	.selectAll('line')	×
86	.data(quadrantData.borderLines)	×
87	.enter()	×
88	.append('line')	×
89	.attr('x1', (data: QuadrantLineType) => data.x1)	×
90	.attr('y1', (data: QuadrantLineType) => data.y1)	×
91	.attr('x2', (data: QuadrantLineType) => data.x2)	×
92	.attr('y2', (data: QuadrantLineType) => data.y2)	×
93	.style('stroke', (data: QuadrantLineType) => data.strokeFill)	×
94	.style('stroke-width', (data: QuadrantLineType) => data.strokeWidth);	×
95	}	×
96		×
97	const quadrants = quadrantsGroup	×
98	.selectAll('g.quadrant')	×
99	.data(quadrantData.quadrants)	×
100	.enter()	×
101	.append('g')	×
102	.attr('class', 'quadrant');	×
103		×
104	quadrants	×
105	.append('rect')	×
106	.attr('x', (data: QuadrantQuadrantsType) => data.x)	×
107	.attr('y', (data: QuadrantQuadrantsType) => data.y)	×
108	.attr('width', (data: QuadrantQuadrantsType) => data.width)	×
109	.attr('height', (data: QuadrantQuadrantsType) => data.height)	×
110	.attr('fill', (data: QuadrantQuadrantsType) => data.fill);	×
111		×
112	quadrants	×
113	.append('text')	×
114	.attr('x', 0)	×
115	.attr('y', 0)	×
116	.attr('fill', (data: QuadrantQuadrantsType) => data.text.fill)	×
117	.attr('font-size', (data: QuadrantQuadrantsType) => data.text.fontSize)	×
118	.attr('dominant-baseline', (data: QuadrantQuadrantsType) =>	×
119	getDominantBaseLine(data.text.horizontalPos)	×
120	)	×
121	.attr('text-anchor', (data: QuadrantQuadrantsType) => getTextAnchor(data.text.verticalPos))	×
122	.attr('transform', (data: QuadrantQuadrantsType) => getTransformation(data.text))	×
123	.text((data: QuadrantQuadrantsType) => data.text.text);	×
124		×
125	const labels = labelGroup	×
126	.selectAll('g.label')	×
127	.data(quadrantData.axisLabels)	×
128	.enter()	×
129	.append('g')	×
130	.attr('class', 'label');	×
131		×
132	labels	×
133	.append('text')	×
134	.attr('x', 0)	×
135	.attr('y', 0)	×
136	.text((data: QuadrantTextType) => data.text)	×
137	.attr('fill', (data: QuadrantTextType) => data.fill)	×
138	.attr('font-size', (data: QuadrantTextType) => data.fontSize)	×
139	.attr('dominant-baseline', (data: QuadrantTextType) => getDominantBaseLine(data.horizontalPos))	×
140	.attr('text-anchor', (data: QuadrantTextType) => getTextAnchor(data.verticalPos))	×
141	.attr('transform', (data: QuadrantTextType) => getTransformation(data));	×
142		×
143	const dataPoints = dataPointGroup	×
144	.selectAll('g.data-point')	×
145	.data(quadrantData.points)	×
146	.enter()	×
147	.append('g')	×
148	.attr('class', 'data-point');	×
149		×
150	dataPoints	×
151	.append('circle')	×
152	.attr('cx', (data: QuadrantPointType) => data.x)	×
153	.attr('cy', (data: QuadrantPointType) => data.y)	×
154	.attr('r', (data: QuadrantPointType) => data.radius)	×
155	.attr('fill', (data: QuadrantPointType) => data.fill);	×
156		×
157	dataPoints	×
158	.append('text')	×
159	.attr('x', 0)	×
160	.attr('y', 0)	×
161	.text((data: QuadrantPointType) => data.text.text)	×
162	.attr('fill', (data: QuadrantPointType) => data.text.fill)	×
163	.attr('font-size', (data: QuadrantPointType) => data.text.fontSize)	×
164	.attr('dominant-baseline', (data: QuadrantPointType) =>	×
165	getDominantBaseLine(data.text.horizontalPos)	×
166	)	×
167	.attr('text-anchor', (data: QuadrantPointType) => getTextAnchor(data.text.verticalPos))	×
168	.attr('transform', (data: QuadrantPointType) => getTransformation(data.text));	×
169	};	×
170		1✔
171	export default {	1✔
172	draw,	1✔
173	};	1✔

mermaid-js / mermaid / 5071601472

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous