Percent Done is rounding the values

[rahulranjan]

Hi
percentage Done i.e completed in tooltip of task is showing rounded value i.e if 0.25% it shows 0%, 32.31% it shows 31% . How can i correct it.

[mats]

Just override our method in TaskModel:

get renderedPercentDone() {
        if (this.percentDone <= 99) {
            return Math.round(this.percentDone);
        }
        else {
            return Math.floor(this.percentDone);
        }
    }

[racing-enedis]

Hello Mats
We have the same issue.
We want to display the percent done with decimals values, in the tooltip of the task, but we can't find the

renderedPercentDone

to override in the taskmodel (gnt.model.task.js)
The version we are using is : Gantt Pro 6.1.17
Can you help us ?
Thanks for your help

[ghulam.ghous]

Hi @racing-enedis,

You will have to override the renderedPercentDone getter defined in PercentDoneMixin.js. See the getter here https://bryntum.com/products/gantt/docs/api/SchedulerPro/model/mixin/PercentDoneMixin#property-renderedPercentDone.

    get renderedPercentDone() {
        const value = typeof this.percentDone === 'number' && !isNaN(this.percentDone) ? this.percentDone : 0;

    return this.getFormattedPercentDone(value);
}

getFormattedPercentDone(value = 0) {
    if (value <= 99) {
        return Math.round(value);
    }

    return Math.floor(value);
}

See our guide about how you can override a method here https://bryntum.com/products/gantt/docs/api/Core/mixin/Override.

Regards,
Ghous

[racing-enedis]

hello @ghulam.ghous

Thank you for your reply, but we use gantt-pro-for-ext-js-6.1.17, i can't find any file named 'PercentDoneMixin.js'.
Do you have another solution ?

[arcady]

Hello,

The tooltip is implemented with Gnt.template.TaskTooltip class
You need to override its getPercentDoneString method. Here is for example I extend that class and change result to display twp decimal places:

// A custom tooltip template
Ext.define("Gnt.examples.advanced.template.TaskTooltip", {
    
    extend : 'Gnt.template.TaskTooltip',

    getPercentDoneString : function(data) {
        var task  = data._record;
        var value = data._useBaselineData ? task.getBaselinePercentDone() : task.getPercentDone();

        // round value to two decimal places 
        return Math.round(value * 100) / 100;
    }

});

Ext.define('Gnt.examples.advanced.view.Gantt', {
    extend : 'Gnt.panel.Gantt',

    requires : [
        'Gnt.examples.advanced.template.TaskTooltip'
    ],

    tooltipTpl : false, // to disable default tooltip

    initComponent() {
        this.tooltipTpl = new Gnt.examples.advanced.template.TaskTooltip();
        
        this.callParent(arguments);
    },
...

Best regards,
Arcady