updated concentration and dose labels to "Infectious Respiratory Part…

…icles"

caimira/apps/calculator/static/js/report.js

@@ -82,7 +82,7 @@ function draw_plot(svg_id) {
         .style('fill', '#1f77b4');
     // Concentration line text
     var legendLineText = vis.append('text')
-        .text('Mean concentration (Infectious Respiratory Particles)')
+        .text('Mean concentration')
 
     // Cumulative dose line icon
     var legendCumulativeIcon = vis.append('line')
@@ -91,7 +91,7 @@ function draw_plot(svg_id) {
         .style("stroke", '#1f77b4');
     // Cumulative dose line text
     var legendCumutiveText = vis.append('text')
-        .text('Cumulative dose (Infectious Respiratory Particles)')
+        .text('Cumulative dose')
 
     //  Area line icon
     var legendAreaIcon = vis.append('rect')
@@ -113,7 +113,6 @@ function draw_plot(svg_id) {
             .attr('opacity', 0);
         var legendLongCumutiveText = vis.append('text')
             .text('Long-range cumulative dose')
-            .style('font-size', '15px')
             .attr('opacity', 0);
         // Short-range area icon
         var legendShortRangeAreaIcon = {};
@@ -130,16 +129,15 @@ function draw_plot(svg_id) {
         var legendShortRangeText = {};
         sr_unique_activities.forEach((b, index) => {
             legendShortRangeText[index] = vis.append('text')
-            .text('Short-range - ' + sr_unique_activities[index])
-            .style('font-size', '15px');
+            .text('Short-range - ' + sr_unique_activities[index]);
         });
     }
 
     // Legend bounding
     if (show_sr_legend) legendBBox_height = 68 + 20 * sr_unique_activities.length;
     else legendBBox_height = 68;
     var legendBBox = vis.append('rect')
-        .attr('width', 420)
+        .attr('width', 270)
         .attr('height', legendBBox_height)
         .attr('stroke', 'lightgrey')
         .attr('stroke-width', '2')
@@ -307,8 +305,8 @@ function draw_plot(svg_id) {
         graph_width = div_width;
         graph_height = div_height
         var margins = { top: 30, right: 20, bottom: 50, left: 60 };
-        if (div_width >= 1100) { // For screens with width > 1100px legend can be on the graph's right side.
-            div_width = 1100;
+        if (div_width >= 1000) { // For screens with width > 1000px legend can be on the graph's right side.
+            div_width = 1000;
             graph_width = 600;
             const svg_margins = {'margin-left': '0rem'};
             Object.entries(svg_margins).forEach(([prop,val]) => vis.style(prop,val));
@@ -358,7 +356,7 @@ function draw_plot(svg_id) {
         yAxisCumLabelEl.attr('transform', 'rotate(-90, 0,' + graph_height + ')')
             .attr('x', (graph_height + margins.bottom) / 2.1);
 
-        if (plot_div.clientWidth >= 1100) {
+        if (plot_div.clientWidth >= 1000) {
             yAxisCumLabelEl.attr('y', graph_width * 1.7);
         }
         else {
@@ -370,7 +368,7 @@ function draw_plot(svg_id) {
         const space_between_text_icon = 30;
         const text_height = 6;
         // Legend on right side.
-        if (plot_div.clientWidth >= 1100) {
+        if (plot_div.clientWidth >= 1000) {
             legendLineIcon.attr('x', graph_width + legend_x_start)
                 .attr('y', margins.top + size);
             legendLineText.attr('x', graph_width + legend_x_start + space_between_text_icon)
@@ -607,7 +605,7 @@ function draw_generic_concentration_plot(
 
     max_key_length = Math.max(Math.max(...(Object.keys(data_for_scenarios).map(el => el.length))), h_line_max_key);
     var legendBBox = vis.append('rect')
-        .attr('width', 9 * max_key_length )
+        .attr('width', 10 * max_key_length )
         .attr('height', 25 * ((Object.keys(data_for_scenarios).length) + h_lines_lenght))
         .attr('stroke', 'lightgrey')
         .attr('stroke-width', '2')
@@ -643,8 +641,7 @@ function draw_generic_concentration_plot(
             .style('fill', colors[scenario_index]);
 
         label_text[scenario_name] = vis.append('text')
-            .text(scenario_name)
-            .style('font-size', '15px');
+            .text(scenario_name);
     }
     if (h_lines) {
         var h_lines_draw = {}, h_line_label_icon = {}, h_line_label_text = {};
@@ -661,8 +658,7 @@ function draw_generic_concentration_plot(
                 .attr('stroke-width', '2')
                 .style("stroke", line.color);
             h_line_label_text[line.label] = vis.append('text')
-                .text(line.label)
-                .style('font-size', '15px');
+                .text(line.label);
         })
     }
 
@@ -743,8 +739,8 @@ function draw_generic_concentration_plot(
         graph_width = div_width;
         graph_height = div_height;
         var margins = { top: 30, right: 20, bottom: 50, left: 60 };
-        if (window_width >= 1100) { // For screens with width > 1100px legend can be on the graph's right side.
-            div_width = 1100;
+        if (window_width >= 1000) { // For screens with width > 1000px legend can be on the graph's right side.
+            div_width = 1000;
             graph_width = 600;
             const svg_margins = {'margin-left': '0rem'};
             Object.entries(svg_margins).forEach(([prop,val]) => vis.style(prop,val));
@@ -796,7 +792,7 @@ function draw_generic_concentration_plot(
             var scenario_index = Object.keys(data_for_scenarios).indexOf(scenario_name)
             // Legend on right side.
             var size = 20 * (scenario_index + 1);
-            if (window_width >= 1100) {
+            if (window_width >= 1000) {
                 label_icons[scenario_name].attr('x', graph_width + legend_x_start)
                     .attr('y', margins.top + size);
                 label_text[scenario_name].attr('x', graph_width + legend_x_start + space_between_text_icon)
@@ -814,7 +810,7 @@ function draw_generic_concentration_plot(
         if (h_lines) {
             h_lines.map((line, index) => {
                 size = 21 * (scenario_index + index + 2); // account for previous legend elements
-                if (window_width >= 1100) {
+                if (window_width >= 1000) {
                     h_line_label_icon[line.label].attr("x1", graph_width + legend_x_start)
                         .attr("x2", graph_width + legend_x_start + 20)
                         .attr("y1", margins.top + size)
@@ -836,7 +832,7 @@ function draw_generic_concentration_plot(
         }
 
         // Legend on right side.
-        if (window_width >= 1100) {
+        if (window_width >= 1000) {
             legendBBox.attr('x', graph_width * 1.02)
                 .attr('y', margins.top * 1.15);
 
@@ -896,8 +892,8 @@ function draw_histogram(svg_id, prob, prob_sd) {
     var vis = d3.select(plot_div).append('svg');
 
     // set the dimensions and margins of the graph
-    if (div_width > 1100) {
-        div_width = 1100;
+    if (div_width > 1000) {
+        div_width = 1000;
         var margins = { top: 30, right: 20, bottom: 50, left: 60 };
         var graph_width = 600;
         const svg_margins = {'margin-left': '0rem'};
@@ -1032,7 +1028,6 @@ function draw_histogram(svg_id, prob, prob_sd) {
     // CDF line text
     vis.append('text')
         .text('CDF')
-        .style('font-size', '15px')
         .attr('x', graph_width + legend_x_start + space_between_text_icon)
         .attr('y', margins.top + size + text_height);      
     //  Hist icon
@@ -1045,7 +1040,6 @@ function draw_histogram(svg_id, prob, prob_sd) {
     //  Hist text
     vis.append('text')
         .text('Histogram')
-        .style('font-size', '15px')
         .attr('x', graph_width + legend_x_start + space_between_text_icon)
         .attr('y', margins.top + 2 * size + text_height*2);
     // Mean text
@@ -1060,7 +1054,6 @@ function draw_histogram(svg_id, prob, prob_sd) {
     // Mean line text
     vis.append('text')
         .text('Mean')
-        .style('font-size', '15px')
         .attr('x', graph_width + legend_x_start + space_between_text_icon)
         .attr('y', margins.top + 3 * size + text_height*3);      
 

caimira/apps/expert.py

@@ -193,8 +193,8 @@ def update_plot(self, model: models.ExposureModel):
         self.ax.set_xlim(left = min(min(infected_presence.boundaries()[0]), min(exposed_presence.boundaries()[0])), 
                         right = max(max(infected_presence.boundaries()[1]), max(exposed_presence.boundaries()[1])))
 
-        figure_legends = [mlines.Line2D([], [], color='#3530fe', markersize=15, label='Mean concentration (Infectious Respiratory Particles)'),
-                   mlines.Line2D([], [], color='#0000c8', markersize=15, ls="dotted", label='Cumulative dose (Infectious Respiratory Particles)'),
+        figure_legends = [mlines.Line2D([], [], color='#3530fe', markersize=15, label='Mean concentration'),
+                   mlines.Line2D([], [], color='#0000c8', markersize=15, ls="dotted", label='Cumulative dose'),
                    patches.Patch(edgecolor="#96cbff", facecolor='#96cbff', label='Presence of exposed person(s)')]
         self.ax.legend(handles=figure_legends)
 

caimira/apps/templates/base/calculator.report.html.j2

@@ -181,6 +181,7 @@
 									let short_range_expirations = {{ short_range_expirations | JSONify }};
 									draw_plot("concentration_plot");
 								</script>
+								<i>IRP - Infectious Respiratory Particles.</i>
 							</p>
 						</div>
 					</div>