zhangjiakou
/
hb-cyjc-zhangjiakou
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
张家口产业监测
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
3 Commits
1 Branch
0 Tags
236 MiB
 
 
 
 
Tag: Branch: Tree: main
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'main'
${ noResults }
hb-cyjc-zhangjiakou/WebRoot/feature/visitorV2/衡水旅游数据-游客画像2.html

350 lines
12 KiB
Raw Permalink Blame History

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="css/cjy_style2.css" />
<!--衡水旅游大数据-->
<link type="text/css" rel="stylesheet" href="css/hs_data.css" />
<title>游客画像</title>
</head>
<body style="height:1080px; width:1920px;">
<div class="xingk"></div>
<div class="header">
<h3 class="header_bt">衡水旅游大数据</h3>
<a class="nav" id="showLeft"><i class="nav_icon icon_caidan"></i>菜单</a> <a href="#" class="nav_home"><i class="nav_icon icon_zhuye"></i>主页</a> </div>
<div class="zuoce cbp-spmenu-left" id="cbp-spmenu-s1"> <a href="#"><i class="nav_icon icon_zhuye"></i>首页</a> <a href="#"><i class="nav_icon kljc_icon"></i>客流量监测</a> <a href="#"><i class="nav_icon tous_icon"></i>旅游投诉分析</a> <a href="#"><i class="nav_icon eav_icon"></i>网络评价分析</a> <a href="#" class="on"><i class="nav_icon basic_icon"></i>旅游基础资源</a> <a href="#"><i class="nav_icon video_icon"></i>视频监控管理</a> <a href="#"><i class="nav_icon yjzh_icon"></i>视频监控管理</a> </div>
<!--左侧----->
<div class="index_left left">
<div class="left_top_big">
<!--游客属性-->
<div class="w320_hs" style="margin-left: 0">
<h3 class="box_bt">游客属性</h3>
<div class="box_top_s"></div>
<div class="box_center_s">
<div class="con" >
<!--年龄分布-->
<h3 class="hsyk_tit"> 年龄分布 </h3>
<div class="hs_agefb" style="height: 200px; "> <img src="img_hs/img_yknl.png"> </div>
<!--性别比例-->
<h3 class="hsyk_tit">性别比例</h3>
<div class="sex_box">
<!--男女图标展示-->
<div class="hs_sex" >
<div class="sex_half"> <img src="img_hs/sex_nan.png">
<h5>男性 <span>56.23%</span></h5>
</div>
<div class="sex_half"> <img src="img_hs/sex_nv.png">
<h5>女性 <span>26.09%</span></h5>
</div>
</div>
<!--男女比例进度条-->
<div class="scale_bar">
<!--取男性比例值-->
<div class="get_nan" style="width: 56.9%;"></div>
</div>
<!--总人数-->
<p class="scale_whole">总人数：32322万</p>
</div>
</div>
</div>
<div class="box_bottom_s"></div>
</div>
<!--热力图-->
<div class="rel_warp" >
<div class="rel_img"> <img src="img_hs/rlt.png"> </div>
<div class="rel_klnum">
<div>
<div class="tjsl">
<p class="tjbt">实时客流量</p>
<div class="gdsz" style="width:200px;">
<div class="shuzi">
<div class="numberRun4"></div>
</div>
<p class="szdw">人次</p>
<div class="mb_left"></div>
<div class="mb_right"></div>
</div>
</div>
</div>
<div style="padding-top:100px;">
<div>
<div class="tjsl">
<p class="tjbt">当月客流量</p>
<div class="gdsz" style="width:250px;">
<div class="shuzi">
<div class="numberRun5"></div>
</div>
<p class="szdw">人次</p>
<div class="mb_left"></div>
<div class="mb_right"></div>
</div>
</div>
</div>
<div>
<div class="tjsl">
<p class="tjbt">当年客流量</p>
<div class="gdsz" style="width:250px;">
<div class="shuzi">
<div class="numberRun5"></div>
</div>
<p class="szdw">人次</p>
<div class="mb_left"></div>
<div class="mb_right"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--右侧----->
<div class="index_right right">
<div class="w320_hs">
<h3 class="box_bt">游客偏好景区</h3>
<div class="box_top_s"></div>
<div class="box_center_s" style=" height:560px;">
<div class="con">
<!--景区Top10-->
<h3 class="hsyk_tit"> 景区Top10 </h3>
<div class="ykph_box">
<!--每个条目-->
<div class="entry_one"> <span class="eny_num">1</span>
<div class="eny_inf">
<h3>衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 98%"></div>
</div>
</div>
<h6 class="eny_figure">212,235,2</h6>
</div>
<!--每个条目-->
<div class="entry_one"> <span class="eny_num">2</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 90%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
<div class="entry_one"> <span class="eny_num">3</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 82%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
<div class="entry_one"> <span class="eny_num">4</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 76%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
<div class="entry_one"> <span class="eny_num">5</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 68%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
<div class="entry_one"> <span class="eny_num">6</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 50%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
<div class="entry_one"> <span class="eny_num">7</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 32%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
<div class="entry_one"> <span class="eny_num">8</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 18%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
<div class="entry_one"> <span class="eny_num">9</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 12%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
<div class="entry_one"> <span class="eny_num">10</span>
<div class="eny_inf">
<h3>衡水湖</h3>
<div class="inf_item">
<div class="inf_strip" style="width: 8%"></div>
</div>
</div>
<h6 class="eny_figure">2122</h6>
</div>
</div>
<!--近一周过夜趋势-->
<!-- <h3 class="hsyk_tit"> 近一周过夜趋势 </h3>
<div class="rt_btm_1" style="height: 290px; "> <img src="img_hs/img_gyqs.png"> </div>-->
</div>
</div>
<div class="box_bottom_s"></div>
</div>
</div>
<!--底部-消费统计-->
<div class="bot_layout">
<!--消费量-->
<div class="left w452_hs" >
<h3 class="box_bt">消费量</h3>
<div class="box_top_s"></div>
<div class="box_center_s">
<div class="con" >
<div class="hs_xflev" style="height:218px;"><img src="img_hs/img_xfl.png"></div>
</div>
</div>
<div class="box_bottom_s"></div>
</div>
<!--消费水平-->
<div class="w452_hs left">
<h3 class="box_bt">省内消费城市TOP5</h3>
<div class="box_top_s"></div>
<div class="box_center_s">
<div class="con" >
<div class="hs_xflev pay_1" style="height:218px;">
<!--TOP5-->
<img src="img_hs/pay_1.png" class="pay_1_img"/>
<div class="pay_1_lst">
<ul>
<li><h3>121245万元</h3><p>衡水市</p></li>
<li><h3>121245万元</h3><p>衡水市</p></li>
<li><h3>121245万元</h3><p>衡水市</p></li>
<li><h3>121245万元</h3><p>衡水市</p></li>
<li><h3>121245万元</h3><p>衡水市</p></li>
</ul>
</div>
</div>
</div>
</div>
<div class="box_bottom_s"></div>
</div>
<!--省外消费-->
<div class="w452_hs left" >
<h3 class="box_bt">省外消费城市TOP5</h3>
<div class="box_top_s"></div>
<div class="box_center_s">
<div class="con" >
<div class="hs_xflev pay_2" style="height:218px;">
<!--TOP5-->
<img src="img_hs/pay_2.png" class="pay_2_img"/>
<div class="pay_2_lst">
<ul>
<li>衡水市<span>121245万元</span></li>
<li>衡水衡水市市<span>121245万元</span></li>
<li>衡水衡市<span>121245万元</span></li>
<li>衡水市<span>121245万元</span></li>
<li>衡水市<span>121245万元</span></li>
</ul>
</div>
</div>
</div>
</div>
<div class="box_bottom_s"></div>
</div>
<!--消费省份-->
<div class="w452_hs left" >
<h3 class="box_bt">消费省份</h3>
<div class="box_top_s"></div>
<div class="box_center_s">
<div class="con" >
<div class="hs_xflev pay_province" style="height:218px;">
<!--TOP5-->
<div class="ykph_box ">
<!--每个条目-->
<div class="entry_one"> <span class="eny_num">1</span>
<div class="pay_adr">河北省</div>
<h6 class="eny_figure">2,235,2万元</h6>
</div>
<div class="entry_one"> <span class="eny_num">2</span>
<div class="pay_adr">河北省</div>
<h6 class="eny_figure">212,235,2</h6>
</div>
<div class="entry_one"> <span class="eny_num">3</span>
<div class="pay_adr">河北省</div>
<h6 class="eny_figure">212,235,2</h6>
</div>
<div class="entry_one"> <span class="eny_num">4</span>
<div class="pay_adr">河北省</div>
<h6 class="eny_figure">212,235,2</h6>
</div>
<div class="entry_one"> <span class="eny_num">5</span>
<div class="pay_adr">河北省</div>
<h6 class="eny_figure">212,235,2</h6>
</div>
</div>
</div>
</div>
</div>
<div class="box_bottom_s"></div>
</div>
<div class="clear"></div>
</div>
<!--数字滚动-->
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/numberRun.js"></script>
<!--左侧滑动菜单-->
<script src="js/classie.js"></script>
<script>
var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
showLeft = document.getElementById( 'showLeft' ),
body = document.body;
showLeft.onclick = function() {
classie.toggle( this, 'active' );
classie.toggle( menuLeft, 'cbp-spmenu-open' );
disableOther( 'showLeft' );
};
function disableOther( button ) {
if( button !== 'showLeft' ) {
classie.toggle( showLeft, 'disabled' );
}
}
</script>
</body>
</html>