1

我想要一个 java 脚本以圆圈的形式显示结果,其中百分比值位于中心,这些值是由于在不同类别中选中的复选框数量而返回的。圆的半径需要根据百分比值计算。比方说,小 40%,大 80%。

例如,

环境:

  1. 保持环境清洁,

  2. 避免污染。

    自然:

  3. 保护自然。

  4. 种树。

    如果在“环境”部分中选中了 1 个复选框,如果在“自然”中选中了 2 个复选框,则“自然”需要具有高百分比值,显示圆中心的百分比值,低百分比值的环境显示较小的圆,百分比值位于中央。我需要有5个这样的圈子。有人可以帮忙吗。

谢谢。

4

2 回答 2

1

尝试,

JavaScript:

   $(function(){

    var maxWidth = 500, // This is the max width of your circle

    percent = Number($('#result').text()); // This is the percentage value

    percent = percent / 100;

    $("#circle").css({

        "width" : maxWidth * percent,

        "height" : maxWidth * percent,


    });
});

CSS:

  #circle {

    border: 1px solid red;

    border-radius: 50%;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

    background:blue;

}

于 2013-12-12T11:15:21.727 回答
0

就像是?http://jsfiddle.net/jonigiuro/xP25c/

function createCircles(value1, value2, value3, value4) {
    $('.one').css({
        width: value1 * 2,
        height: value1 * 2,
        lineHeight: value1  / 10
    }).text(value1 + '%');
}

然后这样称呼它:

createCircles(20,50,5,15);

这些数字是值。

或者我为类似的东西创建了一个 jQuery 插件:

http://zhereicome.com/experiments/statics/statisquares/

于 2013-09-06T08:12:16.553 回答