javascript - 在 Flot 饼图中显示数据值而不是百分比

标签 javascript jquery flot

我正在使用 http://github.com/krzysu/flot.tooltip .它显示数据的百分比如下。但我需要显示实际值而不是百分比。我该怎么做?

chart

Json 数据

[{"data":350,"label":"Transport"},{"data":250,"label":"Meals"},{"data":250,"label":"Kitchen"},{"data":7280.5,"label":"Construction"},{"data":3725,"label":"Fuel"},{"data":160,"label":"Stationary"}]

脚本

function make_chart() {

    $.ajax({
        cache : 'false',
        type : 'GET',
        dataType : 'json',
        url : "piechart",
        success : function(json) {

            var plotObj = $.plot($("#flot-pie-chart"), json, {
                series: {
                    pie: {
                        show: true
                    }
                },
                grid: {
                    hoverable: true
                },
                tooltip: true,
                tooltipOpts: {
                    content: "%p.0%, %s", // show percentages, rounding to 2 decimal places
                    shifts: {
                        x: 20,
                        y: 0
                    },
                    defaultTheme: false
                }
            });             

        }
    });
}

最佳答案

只需修改tooltipOpts:content属性;将 %p 替换为 %y:

tooltipOpts: {
  content: "%y.0, %s", // show value to 0 decimals
  shifts: {
      x: 20,
      y: 0
  },
  defaultTheme: false
}

fiddle here .

或者使用函数以获得更大的灵 active :

content: function(label,x,y){
    return y+", "+label;
},

fiddle here .

关于javascript - 在 Flot 饼图中显示数据值而不是百分比,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24413003/

相关文章:

jquery - 如何在 MVC 4 中使用 jQuery 更新 List<Model>

JQuery float 饼图大小错误

javascript - 向下滚动时将类添加到下一个元素,并从父元素中删除类

javascript - 输入 :radio click function isn't triggering in IE/Firefox

php - 日历加载或 JavaScript 错误

php - 如何json_encode php数组但没有引号的键

javascript - Flot:尝试在页面加载时绘制图表时弹出奇怪的错误?

javascript - 将 Node.js 代码捆绑到一个文件中?

javascript - 无法使用 Sinon 在导入的文件中 stub 函数调用

javascript - jQuery 对象到字符串请帮忙