Template.residentActivityTypesChart.onRendered(function () {
  // Get activities from template data
  let activities = Template.currentData().activities;

  // Add 'type' field to each activity,
  // Containing activity type name
  activities = _.map(activities, function (activity) {
    // Get activity type name via collection helper
    activity.type = activity.activityType();

    return activity;
  });

  // Group activities by activity type
  const activityTypeCounts = d3.nest()
    .key(function (activity) {
      return activity.type;
    })
    .rollup(function (activityType) { return activityType.length })
    .entries(activities);

    // Get reference to chart container
    const svg = dimple.newSvg("#activityTypesChart", "100%", "100%");

    // Initialize the activity type chart
    const activityTypesChart = new dimple.chart(svg, activityTypeCounts);

    // Set chart boundaries based on parent container size
    activityTypesChart.setBounds("5%", "5%", "95%", "80%");

    // Add activity types to x axis
    const xAxis = activityTypesChart.addCategoryAxis("x", "key");

    // Set the y axis title
    const xAxisTitle = TAPi18n.__("residentActivityTypesChart-xAxis-title");
    xAxis.title = xAxisTitle;

    // Reduce the x axis font size, so labels do not get truncated
    xAxis.fontSize = "7px";

    // Add activity type counts to y axis
    const yAxis = activityTypesChart.addMeasureAxis("y", "values");

    // Disable grid lines
    yAxis.showGridlines = false;

    // Set the y axis title
    const yAxisTitle = TAPi18n.__("residentActivityTypesChart-yAxis-title");
    yAxis.title = yAxisTitle;

    // Add bar plot
    activityTypesChart.addSeries(null, dimple.plot.bar);

    // Render chart
    activityTypesChart.draw();
});

@@ -964,17 +964,18 @@
 Bounds(%22
-5
+30
 %25%22, %225%25%22
@@ -981,16 +981,16 @@
 %22, %22
-9
+6
 5%25%22, %22
-8
+7
 0%25%22)
@@ -1072,16 +1072,15 @@
 .add
-Category
+Measure
 Axis
@@ -1086,19 +1086,22 @@
 s(%22x%22, %22
-key
+values
 %22);%0A%0A   
@@ -1329,16 +1329,76 @@
 %227px%22;%0A%0A
+    // Disable grid lines%0A    xAxis.showGridlines = false;%0A%0A
     // A
@@ -1467,31 +1467,32 @@
 pesChart.add
-Measure
+Category
 Axis(%22y%22, %22v
@@ -1494,76 +1494,13 @@
 %22, %22
-values%22);%0A%0A    // Disable grid lines%0A    yAxis.showGridlines = false
+key%22)
 ;%0A%0A 

Change chart axes; adjust layout