add FreeSerif font to handle special characters and use oncoprinterjs…

…-2.0.1
cBioPortal · Mar 25, 2019 · c21aeb0 · c21aeb0
1 parent d562021
commit c21aeb0
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 36 deletions.
diff --git a/package.json b/package.json
@@ -153,7 +153,7 @@
     "node-sass": "^4.9.3",
     "numeral": "^2.0.6",
     "object-sizeof": "^1.2.0",
-    "oncoprintjs": "2.0.0",
+    "oncoprintjs": "2.0.1",
     "parameter-validator": "^1.0.2",
     "pdfobject": "^2.0.201604172",
     "pegjs": "^0.10.0",

diff --git a/src/pages/studyView/charts/barChart/BarChartAxisLabel.tsx b/src/pages/studyView/charts/barChart/BarChartAxisLabel.tsx
@@ -26,32 +26,29 @@ export class BarChartAxisLabel extends VictoryLabel {
             key: style[0].textAnchor || textAnchor
         };
 
-        let tspan;
+        let tspan = [];
 
         // add the second string as a superscript
         // we are not using baselineShift property due to compatibility issues, instead adjusting dy
         // for more details see https://stackoverflow.com/questions/12332448/subscripts-and-superscripts-in-svg
         if (content.length > 1) {
-            tspan = (
-                <tspan {...tspanProps}>
-                    {content[0]}
-                    <tspan
-                        dy={-style[0].fontSize/2}
-                        style={{...style[0], fontSize: "70%"}}
-                    >
-                        {content[1]}
-                    </tspan>
-                </tspan>
-            );
+            tspan.push(<tspan {...tspanProps}>{content[0]}</tspan>);
+            tspan.push(
+                        <tspan
+                            dy={-style[0].fontSize/2}
+                            style={{...style[0], fontSize: style[0].fontSize * 0.7}}
+                        >
+                            {content[1]}
+                        </tspan>);
         }
         else {
-            tspan = <tspan {...tspanProps}>{content[0]}</tspan>;
+            tspan.push(<tspan {...tspanProps}>{content[0]}</tspan>);
         }
 
         return React.cloneElement(
             props.textComponent,
             { dx, dy, x, y, events, transform, className, title, desc },
-            [tspan]
+            tspan
         );
     }
 }

diff --git a/src/shared/lib/svgToPdfDownload.ts b/src/shared/lib/svgToPdfDownload.ts
@@ -16,28 +16,18 @@ function base64ToArrayBuffer(base64:string) {
 export default function svgToPdfDownload(fileName: string, svg: any) {
     const width = svg.scrollWidth || parseInt((svg.attributes.getNamedItem('width') as Attr).nodeValue!), height = svg.scrollHeight || parseInt((svg.attributes.getNamedItem('height') as Attr).nodeValue!);
 
-    // dealing with oncoprint svg (temporarily)
-    _.forEach((svg as Element).childNodes, (element => {
-        if ((element as Element).attributes.getNamedItem('x') !== null && (element as Element).attributes.getNamedItem('y') !== null && (element as Element).nodeName === 'g') {
-            (element as Element).attributes.removeNamedItem('y');
-            (element as Element).attributes.removeNamedItem('x');
-        }
-        _.forEach((element as ChildNode).childNodes,(child => {
-            if ((child as Element).attributes.getNamedItem('x') !== null && (child as Element).attributes.getNamedItem('y') !== null  && (child as Element).nodeName === 'g') {
-                (child as Element).attributes.removeNamedItem('y');
-                (child as Element).attributes.removeNamedItem('x');
-            }
-        }))
-    }));
-
     // create a new jsPDF instance
     let direction = 'l';
     if (height > width) {
         direction = 'p';
     }
 
     const pdf = new jsPDF(direction, 'pt', [width, height]);
-
+
+    const font = require("shared/static-data/font.json");
+    pdf.addFileToVFS("FreeSans-normal.ttf", font.FreeSans);
+    pdf.addFont("FreeSans-normal.ttf", "FreeSans", "normal");
+
     // render the svg element
     svg2pdf(svg, pdf, {
         xOffset: 0,

diff --git a/src/shared/static-data/font.json b/src/shared/static-data/font.json
diff --git a/src/shared/theme/cBioPoralTheme.ts b/src/shared/theme/cBioPoralTheme.ts
@@ -41,7 +41,7 @@ const baseProps = {
 // * Labels
 // *
 export const baseLabelStyles = {
-    fontFamily: sansSerif,
+    fontFamily: `FreeSans, ${sansSerif}`,
     fontSize,
     letterSpacing,
     padding,
@@ -233,7 +233,7 @@ const CBIOPORTAL_VICTORY_THEME = {
                 strokeWidth:1,
                 stroke:"black"
             },
-            labels: baseLabelStyles,
+            labels: assign({}, baseLabelStyles, { fontFamily: sansSerif }),
             title: assign({}, baseLabelStyles, { padding: 5 })
         }
     }

diff --git a/yarn.lock b/yarn.lock
@@ -9335,10 +9335,10 @@ once@~1.3.0:
   dependencies:
     wrappy "1"
 
-[email protected].0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/oncoprintjs/-/oncoprintjs-2.0.0.tgz#ffeb378a0e914b51ff546808ca7a42b4195a2114"
-  integrity sha512-MT5QAQFvfqxAi6JItU43nY6wMszv/3n9DklAhZBsgUEQPCGgRzkX46kgXpbvPj571iMNE6xX/h0B/cs5GLIRwQ==
+[email protected].1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/oncoprintjs/-/oncoprintjs-2.0.1.tgz#6bb3a178995f9f739b0c7c0696dac31f4c96cbe0"
+  integrity sha512-X7LHQiGGOfWKOq2mX9JD8KkRoflu7oWgXW8PkdmEcnh5T7t1EQ3PmV2jVmnJJTnWbSyQsr6n3atdTpqgGWtyYA==
   dependencies:
     express "^4.15.3"
     gl-matrix "2.3.2"