Module: roundprogress

圆环进度控制(单条件)
Implements:
Source:
See:

Example

<style>
    html, body {
        background: #5dbcf0;
    }
    .comp-rp{
        color: #fff;
        text-align: center;
        border: 2px solid #fff;
        width: 88px;
        height: 88px;
        border-radius: 50%;
        position: relative;
        display: inline-block;
        margin: 0 30px;
    }

    .comp-rp-control{
        width: 20px;
        height: 20px;
        margin: 10px;
        background: #fff;
        border-radius: 10px;
        position: absolute;
        cursor: pointer;
    }
</style>
<div class="comp-rp" 
    data-comp="RoundProgress"
    data-value="99"
    data-min_value="0"
    data-max_value="100"
    >
    <h3 >
        <span data-type="text">30</span>
        <sup >%</sup>
    </h3>
    <p >亮度</p>
    <div class="comp-rp-control" data-control="point" style="left: 21.1116px; top: -21.9092px;" ></div>
</div>
<script>
    requirejs( [ 'v.roundprogress' ], function( RoundProgress ){
        RoundProgress.trigger( RoundProgress.init );
    });
</script>

Requires

Namespaces

update

Events


init

初始化圆环
Parameters:
Name Type Description
_wrapper selector 要初始化的复选框
_isItem boolean 声明 _wrapper 是否为单个组件, 否则初始化 _wrapper 下的所有 RoundProgress, default: false
Source:
Example
RoundProgress.trigger( RoundProgress.init, [ 'body' ]  )
//RoundProgress.trigger( RoundProgress.init, [ $( 'div[data-comp=RoundProgress]', true ) ]  )

initItem

初始化单个圆环
Parameters:
Name Type Description
_item selector 要初始化的圆环
Source:
Example
RoundProgress.trigger( RoundSpan.RoundProgress, [ 'div[data-comp=RoundProgress]:first' ]  )