HeatGrid Chart - Composite Y Axis with Multiline Label

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.19/require.min.js"></script>
<script src="//webdetails.github.io/ccc/charts/lib/amd/require.config.js"></script>
<script src="//webdetails.github.io/ccc/charts/lib/q01-01.js"></script>
<div id="cccExample" />

JavaScript

require([
  "ccc/pvc", 
  "ccc/def", 
  "ccc/protovis"
], function(pvc, def, pv) {

  def.setDebug(16);

  new pvc.HeatGridChart({
      canvas: 'cccExample',
      width:   300,
      height:  700,
      orientation: "vertical",

      // Data source
      isMultiValued: true,

      // Visual roles
      sizeRole:  'value',
      colorRole: 'value2',
      seriesRole: "ss",

      // Main plot options
      useShapes: true,
      shape:     'circle',
      valuesVisible:  false,

      // Cartesian axes
      axisComposite: true,
      axisFont: 'normal 10px "Open Sans"',
      yAxisSize: 60, // <-- adjust!
      yAxisLabel_call: function() {
          this
            .localProperty("_textLines_")
            .textAngle(0)  
            ._textLines_(function(scene) {
                var font = this.font();
                return pvc.text.justify(scene.vars.tick.label, scene.dx, font)
                     .map(function(line) {
                       return pvc.text.trimToWidthB(scene.dx, line, font, '..');
                     });
            })
            .top(function() { 
                var isSingleLine = this._textLines_().length <= 1;
                return this.delegate() + (isSingleLine ? 0 : -pv.Text.fontHeight(this.font())/2); 
            })
            .text(function(scene) {
                var lines = this._textLines_();
                return lines.length > 0 ? lines[0] : "";
            })

            .add(pv.Label)
            .localProperty("_textLines_")
            .top(function() { 	
                return this.delegate() + pv.Text.fontHeight(this.font());
            })
            .text(function(scene) {
                var lines = this._textLines_();
                return lines.length > 1 ? lines[1] : "";
            });
      },

      // Color axes
      colors: ['#005CA7', '#FFFFFF', '#FFC20F'],
      colorNormByCategory: false
  })
  .setData(testHeatGridComp)
  .render();
});