add p value to boxplots of comparison clinical tab (cBioPortal#4842)

Co-authored-by: Bryan Lai <[email protected]>
thehyve · Feb 5, 2024 · 8e132c3 · 8e132c3
1 parent 2097f99
commit 8e132c3
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 1 deletion.
diff --git a/src/pages/groupComparison/ClinicalData.tsx b/src/pages/groupComparison/ClinicalData.tsx
@@ -861,6 +861,16 @@ export default class ClinicalData extends React.Component<
                                 symbol="circle"
                                 useLogSpaceTicks={true}
                                 legendLocationWidthThreshold={550}
+                                pValue={
+                                    this.showPAndQ
+                                        ? this.highlightedRow.pValue
+                                        : null
+                                }
+                                qValue={
+                                    this.showPAndQ
+                                        ? this.highlightedRow.qValue
+                                        : null
+                                }
                             />
                         );
                     } else if (this.boxPlotData.isError) {

diff --git a/src/pages/groupComparison/ClinicalNumericalDataVisualisation.tsx b/src/pages/groupComparison/ClinicalNumericalDataVisualisation.tsx
@@ -18,6 +18,8 @@ export type ClinicalNumericalDataVisualisationProps = IBoxScatterPlotProps<
     IBoxScatterPlotPoint
 > & {
     type: ClinicalNumericalVisualisationType;
+    pValue: number | null;
+    qValue: number | null;
 };
 
 export class ClinicalNumericalDataVisualisation extends React.Component<
@@ -70,6 +72,8 @@ export class ClinicalNumericalDataVisualisation extends React.Component<
                 legendLocationWidthThreshold={
                     this.props.legendLocationWidthThreshold
                 }
+                pValue={this.props.pValue}
+                qValue={this.props.qValue}
             />
         );
     }

diff --git a/src/pages/groupComparison/MultipleCategoryBarPlot.tsx b/src/pages/groupComparison/MultipleCategoryBarPlot.tsx
@@ -937,7 +937,7 @@ type PQValueLabelProps = {
     qValue: number | null;
 };
 
-const PQValueLabel: React.FunctionComponent<PQValueLabelProps> = props => {
+export const PQValueLabel: React.FunctionComponent<PQValueLabelProps> = props => {
     const pFormatted = formatLabel('p', props.pValue);
     const qFormatted = formatLabel('q', props.qValue);
     return (

diff --git a/src/shared/components/plots/BoxScatterPlot.tsx b/src/shared/components/plots/BoxScatterPlot.tsx
@@ -46,6 +46,7 @@ import classnames from 'classnames';
 import WindowStore from '../window/WindowStore';
 import LegendDataComponent from './LegendDataComponent';
 import LegendLabelComponent from './LegendLabelComponent';
+import { PQValueLabel } from 'pages/groupComparison/MultipleCategoryBarPlot';
 
 export interface IBaseBoxScatterPlotPoint {
     value: number;
@@ -91,6 +92,8 @@ export interface IBoxScatterPlotProps<D extends IBaseBoxScatterPlotPoint> {
     svgRef?: (svgContainer: SVGElement | null) => void;
     compressXAxis?: boolean;
     legendTitle?: string | string[];
+    pValue?: number | null;
+    qValue?: number | null;
 }
 
 type BoxModel = {
@@ -818,6 +821,12 @@ export default class BoxScatterPlot<
                         >
                             {this.title}
                             {this.legend}
+                            <PQValueLabel
+                                x={this.chartWidth - 40}
+                                y={50}
+                                pValue={this.props.pValue || null}
+                                qValue={this.props.qValue || null}
+                            />
                             {this.horzAxis}
                             {this.vertAxis}
                             <VictoryBoxPlot