冰激凌小孩
2022-01-17 09:32
采纳率: 83.3%
浏览 117
已结题

如何将小数以进度条百分比显示

问题遇到的现象和发生背景

img


如何将上述图片中 cup 的占用率 的以 百分比进度条 显示
我这边用的是 ** jqGrid**

问题相关代码,请勿粘贴截图
$(function () {
    $("#jqGrid").jqGrid({
        url: '../serverinforecord/list',
        datatype: "json",
        colModel: [            
            { label: 'id', name: 'id', index: 'id', width: 50, key: true, hidden: true },
            { label: '服务器ip', name: 'serverId', index: 'server_id', width: 80 },
            { label: 'cpu总量', name: 'cpuQuantity', index: 'cpu_quantity', width: 80 ,formatter: cpuFormat},
            { label: 'cpu核数', name: 'cpuNum', index: 'cpu_num', width: 80 },
            { label: 'cpu使用值', name: 'cpuValue', index: 'cpu_value', width: 80 ,formatter: cpuFormat},
            { label: 'cpu占用率', name: 'cpuProportion', index: 'cpu_proportion', width: 80 ,formatter: cpu},
            { label: 'cpu空闲率', name: 'cpuFreeRate', index: 'cpu_free_rate', width: 80 },
            { label: 'cpu等待率', name: 'cpuWaitRate', index: 'cpu_wait_rate', width: 80 },
            { label: '记录时间', name: 'recordTime', index: 'record_time', width: 80 }
        ],
        viewrecords: true,
        height: 385,
        rowNum: 10,
        rowList : [10,30,50],
        rownumbers: true, 
        rownumWidth: 25, 
        autowidth:true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },
        gridComplete:function(){
            //隐藏grid底部滚动条
            $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); 
        }
    });
    function cpuFormat(cellvalue, options, rowObject) {
        if (cellvalue==""||typeof(cellvalue) == "undefined"){
            return "";
        }else{
            return cellvalue + "MHz";
        }
    };
    function cpu(r) {
        console.log(r);
        return r;
    }
});


运行结果及报错内容
我的解答思路和尝试过的方法
我想要达到的结果

img

  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

6条回答 默认 最新

相关推荐 更多相似问题