Drawing a horizontal "target" line on a bar graph

1. 第二种方法:   put in Extension Points

 

Arg:plot_add

 

Value:

 

function() {
    var panel = new pv.Panel()
    .zOrder(999)
    .def('b0', function() {
        var ccc = this.getContext();
        var scale = ccc.chart.axes.ortho.scale;
        var li = ccc.panel._layoutInfo;
        return li.paddings.bottom + scale(y_value);
    });
    
    panel.add(pv.Rule)
    .strokeStyle('#3D80FF')
    .lineWidth(3)
    .left(0)
    .bottom(function() { return this.parent.b0(); })
    .width (function() { return this.parent.width(); })
    .height(null);
    
    return panel;
}

 

 

 

 

 

2. 第二种方法:   put in PreExecution

function f() {
    // Where to draw the horizontal line
    var y_value = 100;
    
    
    // Contains options that were specified in
    // the CDE properties tool window, already translated.
    var cccOptions = this.chartDefinition;

    // Beware that extension points require special treatment
    // (these are not yet translated to CCC options format)
    var eps = Dashboards.propertiesArrayToObject(cccOptions.extensionPoints);


    eps.plot_add = function() {
        var panel = new pv.Panel()
        .zOrder(999)
        .def('b0', function() {
            var ccc = this.getContext();
            var scale = ccc.chart.axes.ortho.scale;
            var li = ccc.panel._layoutInfo;
            return li.paddings.bottom + scale(y_value);
        });

        panel.add(pv.Rule)
        .strokeStyle('#3D80FF')
        .lineWidth(3)
        .left(0)
        .bottom(function() { return this.parent.b0(); })
        .width (function() { return this.parent.width(); })
        .height(null);

        return panel;
    };


    // Convert them to original CDE format:
    cccOptions.extensionPoints = Dashboards.objectToPropertiesArray(eps);
}

 

req

function f() {
    // Where to draw the horizontal line
    var y_value = 100;
    
    
    // Contains options that were specified in
    // the CDE properties tool window, already translated.
    var cccOptions = this.chartDefinition;

    // Beware that extension points require special treatment
    // (these are not yet translated to CCC options format)
    // var eps = Dashboards.propertiesArrayToObject(cccOptions.extensionPoints);


    add_line = ['plot_add', function() {
        var panel = new pv.Panel()
        .zOrder(999)
        .def('b0', function() {
            var ccc = this.getContext();
            var scale = ccc.chart.axes.ortho.scale;
            var li = ccc.panel._layoutInfo;
            return li.paddings.bottom + scale(y_value);
        });

        panel.add(pv.Rule)
        .strokeStyle('#3D80FF')
        .lineWidth(3)
        .left(0)
        .bottom(function() { return this.parent.b0(); })
        .width (function() { return this.parent.width(); })
        .height(null);

        return panel;
    }];
    
    cccOptions.extensionPoints.push(add_line);


    // Convert them to original CDE format:
    cccOptions.extensionPoints;
} 

 

 

这样就能添加一条水平线

...