移动新ui
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.
 
 
 
 
hb_cyjc_yd/WebRoot/feature/visitorV2/衡水旅游数据-游客画像3.html

312 lines
9.6 KiB

<!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="bot_layout lay_flex">
<!--左侧--->
<div style="width:452px;">
<!--购买力--->
<div class="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;">33</div>
</div>
</div>
<div class="box_bottom_s"></div>
</div>
<!--促销敏感度--->
<div class="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:270px;">22</div>
</div>
</div>
<div class="box_bottom_s"></div>
</div>
</div>
<!--中间--->
<div style="flex:2">
<!--滚动数字--->
<div class="yk2_num_sol">
<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 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 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 class="w924_hs">
<h3 class="box_bt">游客属性</h3>
<div class="box_top_s"></div>
<div class="box_center_s">
<div class="con" >
<div class="lay_flex">
<!--年龄分布--->
<div class="yk2_atb_age">
<h3 class="hsyk_tit"> 年龄分布 </h3>
<div class="hs_agefb" style="height: 200px; "> <img src="img_hs/img_yknl.png"> </div>
</div>
<!--性别比例-->
<div class="yk2_sex">
<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>
</div>
<div class="box_bottom_s"></div>
</div>
</div>
<!--右侧--->
<div class="yk2_rit">
<!--购物品类癖好--->
<div class="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;"></div>
</div>
</div>
<div class="box_bottom_s"></div>
</div>
<!---购物搜索关键词-->
<div class="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:270px;">热词图表</div>
</div>
</div>
<div class="box_bottom_s"></div>
</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="../visitorV2/js/jquery-3.7.0.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>