updated legend sizes for scatter plot when color and shape variables …

…are applied

client/plots/sampleScatter.renderer.js

@@ -4,7 +4,7 @@ import { d3lasso } from '#common/lasso'
 import { dt2label, morigin } from '#shared/common.js'
 import { rgb } from 'd3-color'
 import { scaleLinear as d3Linear } from 'd3-scale'
-import { axisLeft, axisBottom, axisTop } from 'd3-axis'
+import { axisLeft, axisBottom } from 'd3-axis'
 import { select } from 'd3-selection'
 import { Menu } from '#dom/menu'
 import { getSamplelstTW, getFilter } from '../mass/groups.js'
@@ -757,7 +757,7 @@ export function setRenderers(self) {
 				const refColorG = legendG.append('g')
 				refColorG
 					.append('path')
-					.attr('transform', c => `translate(${offsetX - 2}, ${offsetY - 5}) scale(0.6)`)
+					.attr('transform', c => `translate(${offsetX - 2}, ${offsetY - 5}) scale(1.2)`)
 					.style('fill', colorRefCategory.color)
 					.attr('d', shapes[0])
 					.style('stroke', rgb(colorRefCategory.color).darker())
@@ -766,7 +766,7 @@ export function setRenderers(self) {
 				const refText = legendG
 					.append('g')
 					.append('text')
-					.attr('x', offsetX + 15)
+					.attr('x', offsetX + 20)
 					.attr('y', offsetY)
 					.text(`n=${colorRefCategory.sampleCount}`)
 					.style('text-decoration', !self.settings.showRef ? 'line-through' : 'none')
@@ -802,16 +802,16 @@ export function setRenderers(self) {
 
 					itemG
 						.append('path')
-						.attr('transform', c => `translate(${offsetX}, ${offsetY - 5}) scale(0.6)`)
+						.attr('transform', c => `translate(${offsetX}, ${offsetY - 5}) scale(1.2)`)
 						.style('pointer-events', 'bounding-box')
 						.style('fill', color)
 						.attr('d', symbol)
 						.style('stroke', rgb(color).darker())
 
 					itemG
 						.append('text')
-						.attr('x', offsetX + 15)
-						.attr('y', offsetY)
+						.attr('x', offsetX + 25)
+						.attr('y', offsetY + 7)
 						.text(`${name}, n=${count}`)
 						.style('text-decoration', hidden ? 'line-through' : 'none')
 						.attr('alignment-baseline', 'middle')
@@ -833,7 +833,7 @@ export function setRenderers(self) {
 			circleG
 				.append('path')
 				.attr('d', shapes[0])
-				.attr('transform', `translate(${x - 2}, ${y - 5}) scale(0.6)`)
+				.attr('transform', `translate(${x - 2}, ${y - 5}) scale(1.2)`)
 				.style('fill', category.color)
 				.style('stroke', rgb(category.color).darker())
 			if (!self.config.colorColumn)
@@ -842,7 +842,7 @@ export function setRenderers(self) {
 			itemG
 				.append('text')
 				.attr('name', 'sjpp-scatter-legend-label')
-				.attr('x', x + 15)
+				.attr('x', x + 20)
 				.attr('y', y)
 				.text(`${name}, n=${category.sampleCount}`)
 				.style('text-decoration', hidden ? 'line-through' : 'none')
@@ -1065,7 +1065,7 @@ export function setRenderers(self) {
 					const index = category.shape % shapes.length
 					itemG
 						.append('path')
-						.attr('transform', c => `translate(${offsetX - step - 2}, ${offsetY - 8}) scale(0.6)`)
+						.attr('transform', c => `translate(${offsetX - step - 2}, ${offsetY - 8}) scale(1.2)`)
 						.style('fill', 'gray')
 						.style('pointer-events', 'bounding-box')
 						.attr('d', shapes[index])
@@ -1075,8 +1075,7 @@ export function setRenderers(self) {
 					itemG
 						.append('path')
 						.attr('d', shapes[0])
-						.attr('transform', `translate(${-2}, ${offsetY - 8}) scale(0.6)`)
-
+						.attr('transform', `translate(${-2}, ${offsetY - 8}) scale(1.2)`)
 						.style('fill', category.color)
 						.style('stroke', rgb(category.color).darker())
 					itemG.on('click', e => self.onLegendClick(chart, legendG, 'colorTW', key, e, category))
@@ -1085,8 +1084,8 @@ export function setRenderers(self) {
 
 				G.append('g')
 					.append('text')
-					.attr('x', offsetX - step + 14)
-					.attr('y', offsetY)
+					.attr('x', offsetX - step + 24)
+					.attr('y', offsetY + 7)
 					.attr('name', 'sjpp-scatter-legend-label')
 					.style('text-decoration', hidden ? 'line-through' : 'none')
 					.text(mkey + (key.includes(dtlabel) ? `, n=${category.sampleCount}` : ''))