YLSJ
/
server


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
							<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>任务步骤</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <?php include "includelibs.php"; ?>
        <script >
            window.myDateTypeStr = 'none';

            $(function () {
                var myDateslider = $("#sliderDay");
                var myLevelSlider = $('#sliderLevel');
                var timeSpan = $("#timeSpan");
                myDateslider.slider({
                    orientation: "horizontal",
                    range: "min",
                    max: 30,
                    value: 1,
                    slide: function (event, ui) {
                        window.myDateStr = ui.value;
                        $('#days').text(ui.value);
                        if (window.myDateTypeStr == 'Day') {
                            GetData(2); // 任务数据
                        }
                    }
                });
                myLevelSlider.slider({
                    orientation: "horizontal",
                    range: "min",
                    max: 60,
                    value: 1,
                    slide: function (event, ui) {
                        window.myDateStr = ui.value;
                        $('#levels').text(ui.value);
                        if (window.myDateTypeStr == 'level') {
                            GetData(2); // 任务数据
                        }
                    }
                });
                timeSpan.selectmenu({
                    change: function (event, data) {
                        window.myDateTypeStr = data.item.value;
                        GetData(2); // 任务数据
                    }
                });
            });

            function getTitleText() {
                var titlestr = "";
                if (window.myDateTypeStr == 'Day') {
                    titlestr = '第' + window.myDateStr + '天';
                } else if (window.myDateTypeStr == 'none') {
                    titlestr = '综合';
                } else if (window.myDateTypeStr == 'level') {
                    titlestr = window.myDateStr + '级玩家';
                }
                return titlestr + ' 任务步骤完成情况';
            }

        </script>
    </head>
    <body style='max-width:1000px;margin:auto;'> 
        <form action="#" style="margin: auto;">  
            <p>选择日期: <span id="days"></span> </p> 
            <div id="sliderDay" class="slider" ></div>
            <p/>
            <p>选择等级: <span id="levels"></span></p> 
            <div id="sliderLevel" class="slider"  ></div>
            <p/>
            <fieldset>
                <label for="dateType">选择筛选方法</label>
                <select name="timeSpan" id="timeSpan">      
                    <option selected="selected">none</option>
                    <option>Day</option>
                    <option>level</option>
                </select>
            </fieldset> 
        </form>
        <div id="chartContainer" style="max-width:1020px;max-height:500px">
            <canvas id="myChart"  style="width:100%;height:100%;border: 1px solid red;"></canvas>
        </div>
        <p>    说明:</p>
        <ul>
            <li>none: 自上线之日起所有玩家的任务完成情况计数 </li>
            <li>Day: 玩家第n天完成任务情况(最长30天)</li>
            <li>level: 等级为x级的玩家任务完成情况</li>

        </ul>
    </body>
</html>