Horizontal Line and Label At the Maximum Tick Value.

by duarteleao

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) {

    new pvc.LineChart({
        canvas: "cccExample",
        width:  450,
        height: 350,

        plotFrameVisible: false,

        axisGrid:   true,
        axisOffset: 0,
        orthoAxisTicks:false,
        orthoAxisTicks_width: 1, // matters, although invisible...
        orthoAxisRule_visible:  false,
        orthoAxisLabel_textMargin:   3,
        orthoAxisLabel_textAlign:    'left',
        orthoAxisLabel_textBaseline: 'top',
        orthoAxisLabel_visible: function() {
            return this.index === this.scene.parent.childNodes.length - 1;
        },
        orthoAxisGrid_strokeStyle: function() {
            return this.index === this.scene.parent.childNodes.length - 1 
                ? 'black' 
                : this.delegate();
        }
    })
    .setData(relational_04, {crosstabMode: false})
    .render();
});