echart年月过滤显示结果

代码语言:html

所属分类:图表

代码描述:echart年月过滤显示结果

代码标签: 显示 结果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Echarts年月搜索</title>
    <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/jquery-1.8.3.js"></script>
    <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/echarts.js"></script>

    <style>
        .visitor-company {
            width: auto;
            height: 300px;
        }

        .visitor-data {
            width: auto;
            height: 300px;
        }
        /*显示的具体的日期*/

        .select-box {
            float: right;
        }

        .Search {
            float: left;
        }

        .selectBox {
            float: left;
            margin-left: 7px;
            width: 100px;
        }

        .selectBox a i {
            padding-left: 8px;
        }
        /*搜索的内容*/

        .selectBox a {
            text-decoration: none;
            font-size: 14px;
            color: #2f353b;
        }

        .selectBox .but {
            padding: 3px;
            padding-left: 10px;
            padding-right: 10px;
            border: solid 1px #2f353b;
            border-radius: 14px;
        }

        .selectBox ul {
            list-style: none;
            display: none;
            width: 80px;
            margin-top: 4px;
            box-shadow: 3px 3px 3px 3px #888888;
            padding-left: 3px;
            margin-left: 6px;
            background-color: #ffffff;
            border-radius: 3px;
            position: absolute;
            z-index: 10;
        }
        /*鼠标移动事件*/

        .selectBox .but:hover {
            background: #ddd;
        }

        .selectBox li:hover {
            background: #ddd;
        }

        .changeNone {
            display: none;
        }
    </style>
</head>
<body style="width: 70%">
    <h4 class="header-title mb-3 echarts-title">
        访客 数据统计
        <div class="select-box">
            <div class="Search">
                <samp id="Visitor-SearchYear"></samp>年
                <span class="Visitor-SearchMonth"><samp id="Visitor-SearchMonth"></samp>月</span>
            </div>
            <div class="selectBox Visitor-Box">
                <a href="javascript:void(0)" class="but" id="Visitor-ButYear">按年过滤<i class="fa fa-caret-down"></i></a>
                <ul id="Visitor-Year"></ul>
            </div>
            <div class=".........完整代码请登录后点击上方下载按钮下载查看

网友评论0