Show pie charts side-by-side, show '100%' charts

No charts is shown when there is no data or the data is in multiple commodities. Perhaps in that case we should show some error and/or a 'greyed-out' chart?
simonmichael · Feb 5, 2021 · ac00b88 · ac00b88
1 parent 0aa03d7
commit ac00b88
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 9 deletions.
diff --git a/hledger-web/Hledger/Web/Handler/RegisterR.hs b/hledger-web/Hledger/Web/Handler/RegisterR.hs
@@ -129,20 +129,20 @@ moreThanOne (x : xs) = rec xs
 registerPieChartHtml :: PieHalf -> Text -> BalanceReport -> HtmlUrl AppRoute
 registerPieChartHtml half q (items, _) = $(hamletFile "templates/piechart.hamlet")
   where
-    charttitle = "Pie Chart" :: String
     labelData =
       reverse $
       sortOn (\(_, quant, _) -> quant) $
       filter (\(_, quant, _) -> case half of Positive -> quant >= 0
                                              Negative -> quant < 0) $
       flip concatMap items $ \(accname, _, _, Mixed as) ->
         flip map as $ \a -> (accname, aquantity a, acommodity a)
-    moreThanOneAcct = moreThanOne $ map (\(acct, _, _) -> acct) labelData
     moreThanOneCommodity = moreThanOne $ map (\(_, _, com) -> com) labelData
-    showChart = if (moreThanOneAcct && not moreThanOneCommodity) then "true" else "false" :: String
+    showChart = if (moreThanOneCommodity) then "false" else "true" :: String
     noacctlink = (RegisterR, [("q", T.unwords $ removeInacct q)])
     chartId = case half of Positive -> "postive" :: String
                            Negative -> "negative" :: String
+    legendPosition = case half of Positive -> "nw" :: String
+                                  Negative -> "ne" :: String
 
 dayToJsTimestamp :: Day -> Integer
 dayToJsTimestamp d =

diff --git a/hledger-web/templates/piechart.hamlet b/hledger-web/templates/piechart.hamlet
@@ -1,11 +1,10 @@
-<label #register-pie-chart-label style=""><br>
-<div id="register-pie-chart-#{chartId}" style="height:150px; margin-bottom:1em; display:none;">
-<div #piehover>
+<div style="width: 45%; margin-bottom:1em; float: left">
+  <div id="register-pie-chart-#{chartId}" style="height: 150px; display: none">
+  <div id="register-pie-hover-#{chartId}">
 <script type=text/javascript>
  \$(document).ready(function() {
    var $chartdiv = $('#register-pie-chart-#{chartId}');
    if (#{showChart}) {
-     \$('#register-pie-chart-label').text('#{charttitle}');
      \$chartdiv.show();
      var data =
        [
@@ -27,7 +26,8 @@
        },
        legend: {
          show: true,
-         labelFormatter: legendFormatter
+         labelFormatter: legendFormatter,
+         position: "#{legendPosition}"
        }
      };
      \$.plot($chartdiv, data, options);
@@ -36,7 +36,7 @@
          return;
        }
        var percent = parseFloat(obj.series.percent).toFixed(2);
-       \$("#piehover").html("<span style='font-weight:bold; color:" + obj.series.color + "'>" + obj.series.label + " (" + percent + "%)</span>");
+       \$("#register-pie-hover-#{chartId}").html("<span style='font-weight:bold; color:" + obj.series.color + "'>" + obj.series.label + " (" + percent + "%)</span>");
      });
      \$chartdiv.bind("plotclick", function(event, pos, obj) {
        if (!obj) {