From d572ebd33d4d0c25d9d5fe9ace1b850cd979acac Mon Sep 17 00:00:00 2001
From: aokad <aokada@ims.u-tokyo.ac.jp>
Date: Fri, 3 Feb 2017 19:16:51 +0900
Subject: [PATCH 1/2] add option to font-size

---
 scripts/paplot/js/graph_ca.js          |  15 ++-
 scripts/paplot/js/graph_mutation.js    |  24 ++--
 scripts/paplot/js/graph_pmsignature.js |  28 ++--
 scripts/paplot/js/graph_qc.js          |   7 +-
 scripts/paplot/js/graph_signature.js   |  29 +++--
 scripts/paplot/style/large_font.js     | 172 +++++++++++++++++++++++++
 6 files changed, 234 insertions(+), 41 deletions(-)
 create mode 100644 scripts/paplot/style/large_font.js

diff --git a/scripts/paplot/js/graph_ca.js b/scripts/paplot/js/graph_ca.js
index d9b38be..e805051 100644
--- a/scripts/paplot/js/graph_ca.js
+++ b/scripts/paplot/js/graph_ca.js
@@ -48,6 +48,9 @@ function push_export() {
         thumb_height = Number(d3.select("#thumb" + i + "_li").style("height").replace("px", ""));
         thumb_title_height = thumb_height - thumb_width;
         thumb_title_fontsize = Number(d3.select("#thumb" + i + "_li").style("font-size").replace("px", ""));
+        if (thumb_title_height < thumb_title_fontsize) {
+            thumb_title_height = thumb_title_fontsize;
+        }
         break;
     }
     
@@ -94,7 +97,7 @@ function push_export() {
         
         //title
         svgText += downloader.virtual_svg_text(ca_data.index_ID[i], thumb_title_height, thumb_width, sift_x, sift_y, thumb_title_fontsize, true);
-        
+
         // bundle
         svgText += downloader.svg_text("thumb" + i, sift_x, sift_y + thumb_title_height);
         
@@ -218,14 +221,14 @@ function draw_select()
     div_select_bar.options.titles[0].wide = 40;
     div_select_bar.options.titles[0].text_anchor = "middle";
     div_select_bar.options.titles[0].text_rotate = -90;
-    div_select_bar.options.titles[0].font_size = "12px";
+    div_select_bar.options.titles[0].font_size = style_sv_bar.title_y_font_size;//"12px";
     
     div_select_bar.options.titles[1] = new div_select_bar.title_template(style_sv_bar.title_x + " (" + ca_data.node_size_select.toLocaleString() + " [bps])");
     div_select_bar.options.titles[1].orient = "bottom";
     div_select_bar.options.titles[1].wide = 10;
     div_select_bar.options.titles[1].text_anchor = "left";
     div_select_bar.options.titles[1].text_rotate = 0;
-    div_select_bar.options.titles[1].font_size = "14px";
+    div_select_bar.options.titles[1].font_size = style_sv_bar.title_x_font_size;//"14px";
     
     div_select_bar.draw();
     div_select_bar.sort(["pos"], [true]);
@@ -246,9 +249,11 @@ function draw_select()
     div_legend.items   = scale_domain;
     div_legend.colors  = scale_color;
     
-    div_legend.options.title = style_sv_bar.title_top;
+    div_legend.options.title = style_sv_bar.legend_title;
     div_legend.layout.shape_sift_left = 30;
-    
+    div_legend.layout.title_font_size = Number(style_sv_bar.legend_title_font_size.replace("px",""));
+    div_legend.layout.text_font_size = Number(style_sv_bar.legend_text_font_size.replace("px",""));
+        
     div_legend.html_id = "legend_html";
     div_legend.svg_id = "legend_svg";
     div_legend.draw_html();
diff --git a/scripts/paplot/js/graph_mutation.js b/scripts/paplot/js/graph_mutation.js
index 47fa714..057aa48 100644
--- a/scripts/paplot/js/graph_mutation.js
+++ b/scripts/paplot/js/graph_mutation.js
@@ -29,7 +29,7 @@ var genes_length = 0;
 
 // figure options
 var BAR_TOP_AXIS_Y = 50;
-var BAR_LEFT_AXIS_Y = 40;
+var BAR_LEFT_AXIS_Y = (Number(style_mut.title_gene_y1_font_size.replace("px", ""))+Number(style_mut.title_gene_y2_font_size.replace("px", ""))) * 2//40;
 var MULTI_SELECT = false;
 var SPIN_WAIT = 200;
 
@@ -805,8 +805,10 @@ function init() {
     div_legend.items   = mut_data.funcs;
     div_legend.colors  = mut_data.func_colors_n;
     
-    div_legend.options.title = style_mut.func_title;
+    div_legend.options.title = style_mut.legend_title;
     div_legend.layout.shape_sift_left = 10;
+    div_legend.layout.title_font_size = style_mut.legend_title_font_size;
+    div_legend.layout.text_font_size = style_mut.legend_text_font_size;
     
     div_legend.html_id = "legend_html";
     div_legend.svg_id = "legend_svg";
@@ -877,13 +879,14 @@ function init() {
     div_mut_bar_top.options.titles[0].wide = 30;
     div_mut_bar_top.options.titles[0].text_anchor = "middle";
     div_mut_bar_top.options.titles[0].text_rotate = 0;
+    div_mut_bar_top.options.titles[0].font_size = style_mut.title_sample_font_size;
     div_mut_bar_top.options.titles[1] = new div_mut_bar_top.title_template(style_mut.title_sample_y);
     div_mut_bar_top.options.titles[1].orient = "left";
     div_mut_bar_top.options.titles[1].wide = 0;
     div_mut_bar_top.options.titles[1].text_anchor = "middle";
     div_mut_bar_top.options.titles[1].text_rotate = -90;
-    div_mut_bar_top.options.titles[1].font_size = "12px";
-    div_mut_bar_top.options.titles[1].sift_x = 8;
+    div_mut_bar_top.options.titles[1].font_size = style_mut.title_sample_y_font_size; //"12px";
+    div_mut_bar_top.options.titles[1].sift_x = Number(style_mut.title_sample_y_font_size.replace("px", "")) * 0.8; //8;
     
     //div_mut_bar_top.draw();
     
@@ -933,7 +936,7 @@ function init() {
     div_mut_bar_left.options.grid_xs[0].labels = dataset_gene.total_names;
     div_mut_bar_left.options.grid_xs[0].keys = dataset_gene.total_keys;
     div_mut_bar_left.options.grid_xs[0].wide = 80;
-    div_mut_bar_left.options.grid_xs[0].font_size = "9px";
+    div_mut_bar_left.options.grid_xs[0].font_size = style_mut.gene_text_font_size;//"9px";
     div_mut_bar_left.options.grid_xs[0].sift_y = 4;
     div_mut_bar_left.options.grid_xs[0].border_color = style_mut.horizon_border_x_color;
     div_mut_bar_left.options.grid_xs[0].border_width = style_mut.horizon_border_x_width;
@@ -946,20 +949,21 @@ function init() {
     div_mut_bar_left.options.titles[0].wide = 30;
     div_mut_bar_left.options.titles[0].text_anchor = "middle";
     div_mut_bar_left.options.titles[0].text_rotate = -90;
+    div_mut_bar_left.options.titles[0].font_size = style_mut.title_gene_font_size;
     div_mut_bar_left.options.titles[1] = new div_mut_bar_left.title_template(style_mut.title_gene_y1);
     div_mut_bar_left.options.titles[1].orient = "bottom";
     div_mut_bar_left.options.titles[1].wide = 0;
     div_mut_bar_left.options.titles[1].text_anchor = "middle";
     div_mut_bar_left.options.titles[1].text_rotate = 0;
-    div_mut_bar_left.options.titles[1].font_size = "12px";
-    div_mut_bar_left.options.titles[1].sift_y = -20;
+    div_mut_bar_left.options.titles[1].font_size = style_mut.title_gene_y1_font_size; //"12px";
+    div_mut_bar_left.options.titles[1].sift_y = Number(style_mut.title_gene_y1_font_size.replace("px", "")) * (-0.2) -Number(style_mut.title_gene_y2_font_size.replace("px", "")); //-20;
     div_mut_bar_left.options.titles[2] = new div_mut_bar_left.title_template(style_mut.title_gene_y2);
     div_mut_bar_left.options.titles[2].orient = "bottom";
     div_mut_bar_left.options.titles[2].wide = 0;
     div_mut_bar_left.options.titles[2].text_anchor = "middle";
     div_mut_bar_left.options.titles[2].text_rotate = 0;
-    div_mut_bar_left.options.titles[2].font_size = "12px";
-    div_mut_bar_left.options.titles[2].sift_y = -8;
+    div_mut_bar_left.options.titles[2].font_size = style_mut.title_gene_y2_font_size; //"12px";
+    div_mut_bar_left.options.titles[2].sift_y = Number(style_mut.title_gene_y2_font_size.replace("px", "")) * (-0.2); //-8;
     
     //div_mut_bar_left.draw();
     
@@ -1157,6 +1161,8 @@ function sub_plot(sub) {
     div_sub_legend.options.svg_size = [0, 50];
     div_sub_legend.layout.padding_left = 30;
     div_sub_legend.layout.padding_top = 10;
+    div_sub_legend.layout.title_font_size = Number(style_mut.legend_title_font_size.replace("px", ""));
+    div_sub_legend.layout.text_font_size = Number(style_mut.legend_text_font_size.replace("px", ""));
     div_sub_legend.options.horizon = true;
     
     div_sub_legend.svg_id = "div_" + sub.name + "_l_svg"
diff --git a/scripts/paplot/js/graph_pmsignature.js b/scripts/paplot/js/graph_pmsignature.js
index 387b7e2..68f3493 100644
--- a/scripts/paplot/js/graph_pmsignature.js
+++ b/scripts/paplot/js/graph_pmsignature.js
@@ -79,6 +79,8 @@ function init() {
         div_rate_legend.options.title = "signature";
         div_rate_legend.layout.padding_top = 150;
         div_rate_legend.layout.shape_sift_left = 10;
+        div_rate_legend.layout.title_font_size = Number(style_pmsignature.legend_rate_title_font_size.replace("px",""));
+        div_rate_legend.layout.text_font_size = Number(style_pmsignature.legend_rate_text_font_size.replace("px",""));
         div_rate_legend.html_id = "div_rate_legend_html";
         div_rate_legend.svg_id = "div_rate_legend_svg";
         //div_rate_legend.draw_html();
@@ -139,16 +141,16 @@ function init() {
         div_rate.options.titles[0].wide = 0;
         div_rate.options.titles[0].text_anchor = "middle";
         div_rate.options.titles[0].text_rotate = -90;
-        div_rate.options.titles[0].font_size = "12px";
-        div_rate.options.titles[0].sift_x = 8;
+        div_rate.options.titles[0].font_size = style_pmsignature.title_rate_y_font_size;
+        div_rate.options.titles[0].sift_x = Number(style_pmsignature.title_rate_y_font_size.replace("px", "")) * 0.8; //8;
         
         div_rate.options.titles[1] = new div_rate.title_template(style_pmsignature.title_rate);
         div_rate.options.titles[1].orient = "top";
         div_rate.options.titles[1].wide = 30;
         div_rate.options.titles[1].text_anchor = "left";
         div_rate.options.titles[1].text_rotate = 0;
-        div_rate.options.titles[1].font_size = "16px";
-        div_rate.options.titles[1].sift_x = 8;
+        div_rate.options.titles[1].font_size = style_pmsignature.title_rate_font_size;
+        div_rate.options.titles[1].sift_x = Number(style_pmsignature.title_rate_font_size.replace("px", "")) * 0.8; //8;
         
         // for debug
         if (_DEBUG == true) {
@@ -178,6 +180,8 @@ function init() {
         div_integral_legend.options.title = "signature";
         div_integral_legend.layout.padding_top = 150;
         div_integral_legend.layout.shape_sift_left = 10;
+        div_integral_legend.layout.title_font_size = Number(style_pmsignature.legend_integral_title_font_size.replace("px",""));
+        div_integral_legend.layout.text_font_size = Number(style_pmsignature.legend_integral_text_font_size.replace("px",""));
         div_integral_legend.html_id = "div_integral_legend_html";
         div_integral_legend.svg_id = "div_integral_legend_svg";
         //div_integral_legend.draw_html();
@@ -242,16 +246,16 @@ function init() {
         div_integral.options.titles[0].wide = 0;
         div_integral.options.titles[0].text_anchor = "middle";
         div_integral.options.titles[0].text_rotate = -90;
-        div_integral.options.titles[0].font_size = "12px";
-        div_integral.options.titles[0].sift_x = 8;
+        div_integral.options.titles[0].font_size = style_pmsignature.title_integral_y_font_size; //"12px";
+        div_integral.options.titles[0].sift_x = Number(style_pmsignature.title_integral_y_font_size.replace("px", "")) * 0.8; //8;
         
         div_integral.options.titles[1] = new div_integral.title_template(style_pmsignature.title_integral);
         div_integral.options.titles[1].orient = "top";
         div_integral.options.titles[1].wide = 30;
         div_integral.options.titles[1].text_anchor = "left";
         div_integral.options.titles[1].text_rotate = 0;
-        div_integral.options.titles[1].font_size = "16px";
-        div_integral.options.titles[1].sift_x = 8;
+        div_integral.options.titles[1].font_size = style_pmsignature.title_integral_font_size; //"16px";
+        div_integral.options.titles[1].sift_x = Number(style_pmsignature.title_integral_font_size.replace("px", "")) * 0.8; //8;
         
         // for debug
         if (_DEBUG == true) {
@@ -377,7 +381,7 @@ function draw_pmsignature(name, signature_id) {
             msig_data.label_colors.A, msig_data.label_colors.C, msig_data.label_colors.G, msig_data.label_colors.T,
             msig_data.label_colors.A, msig_data.label_colors.C, msig_data.label_colors.G, msig_data.label_colors.T,];
         div_pm1.signature_rects[0].label.text = ["A","C","G","T","A","C","G","T","A","C","G","T","A","C","G","T"];
-        div_pm1.signature_rects[0].label.font_size = "10px";
+        div_pm1.signature_rects[0].label.font_size = style_pmsignature.signature_alt_font_size;
     }
     
     // Ref
@@ -397,7 +401,7 @@ function draw_pmsignature(name, signature_id) {
         div_pm1.signature_rects[i+1].reduce_rate = msig_data.ref_reduce_rate[i];
         div_pm1.signature_rects[i+1].options.colorset = [msig_data.label_colors.A, msig_data.label_colors.C, msig_data.label_colors.G, msig_data.label_colors.T];
         div_pm1.signature_rects[i+1].label.text = ["A","C","G","T"];
-        div_pm1.signature_rects[i+1].label.font_size = "10px";
+        div_pm1.signature_rects[i+1].label.font_size = style_pmsignature.signature_ref_font_size;
     }
     
     // strand
@@ -406,7 +410,7 @@ function draw_pmsignature(name, signature_id) {
         div_pm1.strand.data = dataset_strand.data;
         div_pm1.strand.colorset = [msig_data.label_colors.plus, msig_data.label_colors.minus];
         div_pm1.strand.tooltips = dataset_strand.tooltip;
-        div_pm1.strand.font_size = "10px";
+        div_pm1.strand.font_size = style_pmsignature.signature_strand_font_size;
     }
 
     // border
@@ -427,7 +431,7 @@ function draw_pmsignature(name, signature_id) {
     div_pm1.options.titles[0].wide = 30;
     div_pm1.options.titles[0].text_anchor = "left";
     div_pm1.options.titles[0].text_rotate = 0;
-    div_pm1.options.titles[0].font_size = "12px";
+    div_pm1.options.titles[0].font_size = style_pmsignature.signature_title_font_size;
     
     // other options
     div_pm1.options.resizeable_w = true;
diff --git a/scripts/paplot/js/graph_qc.js b/scripts/paplot/js/graph_qc.js
index fffe3a0..0446f87 100644
--- a/scripts/paplot/js/graph_qc.js
+++ b/scripts/paplot/js/graph_qc.js
@@ -179,8 +179,8 @@ function init() {
             bar.options.titles[0].wide = 0;
             bar.options.titles[0].text_anchor = "middle";
             bar.options.titles[0].text_rotate = -90;
-            bar.options.titles[0].font_size = "12px";
-            bar.options.titles[0].sift_x = 8;
+            bar.options.titles[0].font_size = style_qc.title_y_font_size; //"12px";
+            bar.options.titles[0].sift_x = Number(style_qc.title_y_font_size.replace("px", "")) * 0.8; //8;
         }
         // for debug
         if (_DEBUG == true) {
@@ -204,7 +204,8 @@ function init() {
         legend.colors = info.color;
         legend.options.title = info.title;
         legend.layout.shape_sift_left = 70;
-        
+        legend.layout.title_font_size = Number(style_qc.legend_title_font_size.replace("px",""));
+        legend.layout.text_font_size = Number(style_qc.legend_text_font_size.replace("px",""));
         legend.svg_id = legends[i].chart_id;
         legend.draw_svg(true);
         downloader.set_event_listner (legends[i].chart_id);
diff --git a/scripts/paplot/js/graph_signature.js b/scripts/paplot/js/graph_signature.js
index 8eeb1f9..c2d58e8 100644
--- a/scripts/paplot/js/graph_signature.js
+++ b/scripts/paplot/js/graph_signature.js
@@ -83,6 +83,8 @@ function init() {
         div_rate_legend.options.title = "signature";
         div_rate_legend.layout.padding_top = 150;
         div_rate_legend.layout.shape_sift_left = 10;
+        div_rate_legend.layout.title_font_size = Number(style_signature.legend_rate_title_font_size.replace("px",""));
+        div_rate_legend.layout.text_font_size = Number(style_signature.legend_rate_text_font_size.replace("px",""));
         
         div_rate_legend.html_id = "div_rate_legend_html";
         div_rate_legend.svg_id = "div_rate_legend_svg";
@@ -144,16 +146,16 @@ function init() {
         div_rate.options.titles[0].wide = 0;
         div_rate.options.titles[0].text_anchor = "middle";
         div_rate.options.titles[0].text_rotate = -90;
-        div_rate.options.titles[0].font_size = "12px";
-        div_rate.options.titles[0].sift_x = 8;
+        div_rate.options.titles[0].font_size = style_signature.title_rate_y_font_size; //"12px";
+        div_rate.options.titles[0].sift_x = Number(style_signature.title_rate_y_font_size.replace("px", "")) * 0.8; //8;
         
         div_rate.options.titles[1] = new div_rate.title_template(style_signature.title_rate);
         div_rate.options.titles[1].orient = "top";
         div_rate.options.titles[1].wide = 30;
         div_rate.options.titles[1].text_anchor = "left";
         div_rate.options.titles[1].text_rotate = 0;
-        div_rate.options.titles[1].font_size = "16px";
-        div_rate.options.titles[1].sift_x = 8;
+        div_rate.options.titles[1].font_size = style_signature.title_rate_font_size; //"16px";
+        div_rate.options.titles[1].sift_x = Number(style_signature.title_rate_font_size.replace("px", "")) * 0.8; //8;
         
         // for debug
         if (_DEBUG == true) {
@@ -182,6 +184,8 @@ function init() {
         div_integral_legend.options.title = "signature";
         div_integral_legend.layout.padding_top = 150;
         div_integral_legend.layout.shape_sift_left = 10;
+        div_integral_legend.layout.title_font_size = Number(style_signature.legend_integral_title_font_size.replace("px",""));
+        div_integral_legend.layout.text_font_size = Number(style_signature.legend_integral_text_font_size.replace("px",""));
         
         div_integral_legend.html_id = "div_integral_legend_html";
         div_integral_legend.svg_id = "div_integral_legend_svg";
@@ -247,16 +251,16 @@ function init() {
         div_integral.options.titles[0].wide = 0;
         div_integral.options.titles[0].text_anchor = "middle";
         div_integral.options.titles[0].text_rotate = -90;
-        div_integral.options.titles[0].font_size = "12px";
-        div_integral.options.titles[0].sift_x = 8;
+        div_integral.options.titles[0].font_size = style_signature.title_integral_y_font_size; //"12px";
+        div_integral.options.titles[0].sift_x = Number(style_signature.title_integral_y_font_size.replace("px", "")) * 0.8; //8;
         
         div_integral.options.titles[1] = new div_integral.title_template(style_signature.title_integral);
         div_integral.options.titles[1].orient = "top";
         div_integral.options.titles[1].wide = 30;
         div_integral.options.titles[1].text_anchor = "left";
         div_integral.options.titles[1].text_rotate = 0;
-        div_integral.options.titles[1].font_size = "16px";
-        div_integral.options.titles[1].sift_x = 8;
+        div_integral.options.titles[1].font_size = style_signature.title_integral_font_size; //"16px";
+        div_integral.options.titles[1].sift_x = Number(style_signature.title_integral_font_size.replace("px", "")) * 0.8; //8;
         
         // for debug
         if (_DEBUG == true) {
@@ -392,9 +396,9 @@ function draw_signature(name, signature_id, change_id) {
         .attr({
             'text-color': "#000",
             'text-anchor': "start",
-            'font-size': "12px",
+            'font-size': style_signature.signature_title_font_size, //"12px",
             'font-family': style_general.font_family,
-            'transform': 'translate(' + SIGNATURE_AXIS_YW + ',' + 12 + ')',
+            'transform': 'translate(' + SIGNATURE_AXIS_YW + ',' + style_signature.signature_title_font_size.replace("px", "") + ')',
         });
     
     // append main svg
@@ -429,6 +433,7 @@ function draw_signature(name, signature_id, change_id) {
     div_legend.layout.shape_sift_left = SIGNATURE_AXIS_YW + div_legend.layout.shape_padding/2;
     div_legend.layout.rect_width = (SIGNATURE_W - SIGNATURE_AXIS_YW)/change_list.length - div_legend.layout.shape_padding;
     div_legend.layout.rect_height = 10;
+    div_legend.layout.text_font_size = Number(style_signature.signature_title_x_font_size.replace("px",""));
     div_legend.draw_svg(true);
 
     // each plot
@@ -493,12 +498,12 @@ function draw_signature(name, signature_id, change_id) {
         
         // title
         if (c == 0) {
-            bar.options.titles[0] = new bar.title_template(style_signature.title_signature_y);
+            bar.options.titles[0] = new bar.title_template(style_signature.signature_title_y);
             bar.options.titles[0].orient = "left";
             bar.options.titles[0].wide = SIGNATURE_AXIS_YW;
             bar.options.titles[0].text_anchor = "middle";
             bar.options.titles[0].text_rotate = -90;
-            bar.options.titles[0].font_size = "12px";
+            bar.options.titles[0].font_size = style_signature.signature_title_y_font_size; //"12px";
         }
         
         bar.draw();
diff --git a/scripts/paplot/style/large_font.js b/scripts/paplot/style/large_font.js
new file mode 100644
index 0000000..c4427f1
--- /dev/null
+++ b/scripts/paplot/style/large_font.js
@@ -0,0 +1,172 @@
+(function(){
+style_general = {
+    font_family: "'Helvetica Neue', Helvetica, Arial, sans-serif",
+}
+
+// style of quality check graphs
+style_qc = {
+    brush_border_y_color: "#DDDDCC",
+    brush_border_y_opacity: 0.5,
+    plot_border_y_color: "#DDDDCC",
+    plot_border_y_opacity: 0.2,
+    title_y_font_size: "18px", //"12px",
+    legend_title_font_size: "20px", //"16px",
+    legend_text_font_size: "18px", //"12px",
+};
+
+// style of genome-wide bar plot
+style_sv_bar = {
+    // title's text options
+    title_y: "samples with CA breakp.",
+    title_y_font_size: "18px", //"12px",
+
+    title_x: "Chromosome",
+    title_x_font_size: "18px", //"14px",
+    
+    legend_title: "Genome-wide CAs identify",
+    legend_title_font_size: "20px", //"16px",
+    legend_text_font_size: "18px", //"12px",
+    
+    border_x_main_color: "#E0E0E0",
+    border_x_main_width: "1px",
+    border_x_sub_color: "#A6A6A6",
+    border_x_sub_width: "1px",
+    border_y_color: "#DDDDCC",
+    border_y_opacity: 0.5,
+};
+
+// style of thumbnails
+style_sv_thumb = {
+    // circular sector's color options
+    arc_fill_opacity: 1.0,
+    arc_stroke_opacity: 1.0,
+    
+    // link options
+    link_width: "1px",
+    link_opacity: 1.0,
+};
+
+// style of detail image (on click)
+style_sv_detail = {
+    // windows header
+    win_header_text_color: "#000000",
+    win_header_background_color: "#CFCFCF",
+    win_border_color: "#D3D3D3",
+    win_border_width: "1px",
+    win_background_color: "white",
+    
+    // circular sector's color options
+    arc_fill_opacity: 1.0,
+    arc_stroke_opacity: 1.0,
+    
+    // circular sector's label options
+    arc_label_fontsize: "14px",//"10px",
+    arc_label_color: "#333333",
+    
+    // link options
+    link_width: "2px",
+    link_opacity: 1.0,
+    
+    // link(on mouse) options
+    link_select_color: "#d62728",
+    link_select_width: "3px",
+    link_select_opacity: 1.0,
+};
+
+// style of mutaion-matrix
+style_mut = {
+    // title's text options
+    title_sample: "Sample",
+    title_sample_font_size: "18px", //"14px",
+    title_sample_y: "Number of mutation",
+    title_sample_y_font_size: "18px", //"12px",
+    virtical_border_x_color: "#CCCCEE",
+    virtical_border_x_width: "1px",
+    virtical_border_y_color: "#DDDDCC",
+    virtical_border_y_opacity: 0.5,
+    
+    title_gene: "Genes",
+    title_gene_font_size: "18px", //"14px",
+    title_gene_y1: "% Samplesg",
+    title_gene_y2: "with mutationg",
+    title_gene_y1_font_size: "18px", //"12px",
+    title_gene_y2_font_size: "18px", //"12px",
+    horizon_border_x_color: "#CCCCEE",
+    horizon_border_x_width: "1px",
+    horizon_border_y_color: "#DDDDCC",
+    horizon_border_y_opacity: 0.5,
+    
+    // legend
+    legend_title: "functions",
+    legend_title_font_size: "20px", //"16px",
+    legend_text_font_size: "18px", //"12px",
+    
+    // gene
+    gene_text_font_size: "14px", //"9px",
+    
+    // subplot
+    sub_border_color: "#FFFFFF",
+    sub_border_width: "1px",
+    
+};
+
+// style of signature
+style_signature = {
+    // stack-integral
+    title_integral: "Signature integral",
+    title_integral_font_size: "20px", //"16px",
+    title_integral_y: "membership",
+    title_integral_y_font_size: "18px", //"12px",
+    legend_integral_title_font_size: "20px", //"16px",
+    legend_integral_text_font_size: "18px", //"12px",
+    
+    // stack-rate
+    title_rate: "Signature rate",
+    title_rate_font_size: "20px", //"16px",
+    title_rate_y: "membership",
+    title_rate_y_font_size: "18px", //"12px",
+    legend_rate_title_font_size: "20px", //"16px",
+    legend_rate_text_font_size: "18px", //"12px",
+    
+    //stack-common
+    plot_border_y_color: "#DDDDCC",
+    plot_border_y_opacity: 0.5,
+    
+    // signature
+    signature_title_font_size: "20px", //"12px",
+    signature_title_y: "probaility",
+    signature_title_y_font_size: "20px", //"12px",
+    signature_title_x_font_size: "14px", //"12"px
+    border_y_color: "#DDDDCC",
+    border_y_opacity: 0.5,
+};
+
+// style of pmsignature
+style_pmsignature = {
+    // stack-integral
+    title_integral: "Signature integral",
+    title_integral_font_size: "20px", //"16px",
+    title_integral_y: "membership",
+    title_integral_y_font_size: "18px", //"12px",
+    legend_integral_title_font_size: "20px", //"16px",
+    legend_integral_text_font_size: "18px", //"12px",
+    
+    // stack-rate
+    title_rate: "Signature rate",
+    title_rate_font_size: "20px", //"16px",
+    title_rate_y: "membership",
+    title_rate_y_font_size: "18px", //"12px",
+    legend_rate_title_font_size: "20px", //"16px",
+    legend_rate_text_font_size: "18px", //"12px",
+    
+    //stack-common
+    plot_border_y_color: "#DDDDCC",
+    plot_border_y_opacity: 0.5,
+    
+    // signature
+    signature_alt_font_size: "14px", //"10px",
+    signature_ref_font_size: "14px", //"10px",
+    signature_strand_font_size: "14px", //"10px",
+    signature_title_font_size: "20px", //"12px",
+};
+})();

From fcac09ef1d564cb3f1a5e4c50d57308a50e2e8d3 Mon Sep 17 00:00:00 2001
From: aokad <aokada@ims.u-tokyo.ac.jp>
Date: Fri, 3 Feb 2017 19:19:56 +0900
Subject: [PATCH 2/2] update

---
 scripts/paplot/style/default.js | 73 +++++++++++++++++++++++++++++----
 1 file changed, 65 insertions(+), 8 deletions(-)

diff --git a/scripts/paplot/style/default.js b/scripts/paplot/style/default.js
index 24288f0..77283d1 100644
--- a/scripts/paplot/style/default.js
+++ b/scripts/paplot/style/default.js
@@ -9,14 +9,23 @@ style_qc = {
     brush_border_y_opacity: 0.5,
     plot_border_y_color: "#DDDDCC",
     plot_border_y_opacity: 0.2,
+    title_y_font_size: "12px",
+    legend_title_font_size: "16px",
+    legend_text_font_size: "12px",
 };
 
 // style of genome-wide bar plot
 style_sv_bar = {
     // title's text options
-    title_top: "Genome-wide CAs identify",
     title_y: "samples with CA breakp.",
+    title_y_font_size: "12px",
+
     title_x: "Chromosome",
+    title_x_font_size: "14px",
+    
+    legend_title: "Genome-wide CAs identify",
+    legend_title_font_size: "16px",
+    legend_text_font_size: "12px",
     
     border_x_main_color: "#E0E0E0",
     border_x_main_width: "1px",
@@ -68,22 +77,34 @@ style_sv_detail = {
 style_mut = {
     // title's text options
     title_sample: "Sample",
+    title_sample_font_size: "14px",
     title_sample_y: "Number of mutation",
+    title_sample_y_font_size: "12px",
     virtical_border_x_color: "#CCCCEE",
     virtical_border_x_width: "1px",
     virtical_border_y_color: "#DDDDCC",
     virtical_border_y_opacity: 0.5,
     
     title_gene: "Genes",
-    title_gene_y1: "% Samples",
-    title_gene_y2: "with mutation",
+    title_gene_font_size: "14px",
+    title_gene_y1: "% Samplesg",
+    title_gene_y2: "with mutationg",
+    title_gene_y1_font_size: "12px",
+    title_gene_y2_font_size: "12px",
     horizon_border_x_color: "#CCCCEE",
     horizon_border_x_width: "1px",
     horizon_border_y_color: "#DDDDCC",
     horizon_border_y_opacity: 0.5,
     
-    func_title: "functions",
+    // legend
+    legend_title: "functions",
+    legend_title_font_size: "16px",
+    legend_text_font_size: "12px",
     
+    // gene
+    gene_text_font_size: "9px",
+    
+    // subplot
     sub_border_color: "#FFFFFF",
     sub_border_width: "1px",
     
@@ -91,25 +112,61 @@ style_mut = {
 
 // style of signature
 style_signature = {
+    // stack-integral
     title_integral: "Signature integral",
+    title_integral_font_size: "16px",
     title_integral_y: "membership",
-    title_signature_y: "probaility",
+    title_integral_y_font_size: "12px",
+    legend_integral_title_font_size: "16px",
+    legend_integral_text_font_size: "12px",
+    
+    // stack-rate
     title_rate: "Signature rate",
+    title_rate_font_size: "16px",
     title_rate_y: "membership",
-    title_rate_y: "probaility",
-    border_y_color: "#DDDDCC",
-    border_y_opacity: 0.5,
+    title_rate_y_font_size: "12px",
+    legend_rate_title_font_size: "16px",
+    legend_rate_text_font_size: "12px",
+    
+    //stack-common
     plot_border_y_color: "#DDDDCC",
     plot_border_y_opacity: 0.5,
+    
+    // signature
+    signature_title_font_size: "12px",
+    signature_title_y: "probaility",
+    signature_title_y_font_size: "12px",
+    signature_title_x_font_size: "12px",
+    border_y_color: "#DDDDCC",
+    border_y_opacity: 0.5,
 };
 
 // style of pmsignature
 style_pmsignature = {
+    // stack-integral
     title_integral: "Signature integral",
+    title_integral_font_size: "16px",
     title_integral_y: "membership",
+    title_integral_y_font_size: "12px",
+    legend_integral_title_font_size: "16px",
+    legend_integral_text_font_size: "12px",
+    
+    // stack-rate
     title_rate: "Signature rate",
+    title_rate_font_size: "16px",
     title_rate_y: "membership",
+    title_rate_y_font_size: "12px",
+    legend_rate_title_font_size: "16px",
+    legend_rate_text_font_size: "12px",
+    
+    //stack-common
     plot_border_y_color: "#DDDDCC",
     plot_border_y_opacity: 0.5,
+    
+    // signature
+    signature_alt_font_size: "10px",
+    signature_ref_font_size: "10px",
+    signature_strand_font_size: "10px",
+    signature_title_font_size: "12px",
 };
 })();