Skip to content

html / MeteorologicalBureau

Go to a project
Commit 37fa3bbc by hank
Options

Merge branch 'develop' of gitlab.maxrocky.com:hanjixin/MeteorologicalBureau into develop

parents 446b808d c3357ae2
Showing with 95 additions and 8 deletions
map/index.html
......@@ -13,33 +13,120 @@
width: 100%;
height: 100%;
}
#nav{
position: fixed;
left: 40px;
top:200px;
z-index: 9999;
color: #fff;
}
#nav .item,.subnav div{
cursor:pointer;
}
.icon{
display: block;
float: left;
width: 16px;
height: 16px;
background-image: url(img/menuicon.png);
background-size: 100% 100%;
}
.item{
position: relative;
width: 100px;
height: 20px;
margin-bottom:20px;
background-image: url(img/menu.png);
background-size: 100% 100%;
}
.item.active::after{
content: " ";
z-index:-1;
display: block;
width: 100px;
height: 200px;
background-image: url(img/menuactive.png);
background-repeat: no-repeat;
background-size: 100% auto;
position: absolute;
top:-25%;
}
.subnav{
display: none;
margin-left: 20px;
}
.subnav.active{
display: block;
}
.subnav div{
position: relative;
margin-bottom:20px;
background-image: url(img/menu.png);
background-size: 100% 100%;
width: 80px;
height: 16px;
}
.subnav div.active::after{
content: " ";
z-index:-1;
display: block;
width: 80px;
height: 200px;
background-image: url(img/menuactive.png);
background-repeat: no-repeat;
background-size: 100% auto;
position: absolute;
top:-25%;
}
</style>
</head>
<body>
<div id="container"></div>
<!-- <div id=nav>
<div><img src="" >预警信息</div>
<div><img src="" >设备</div>
<div><img src="" >人员</div>
</div> -->
<div id=nav>
<div class="item" onclick="go(0)"><span class="icon"></span>预警信息</div>
<div class="item active" onclick="go(1)"><span class="icon"></span>设备</div>
<div class="subnav active subnav1">
<div class=active onclick="go(1,0)">大喇叭</div>
<div onclick="go(1,1)">显示屏</div>
<div onclick="go(1,2)">北斗</div>
</div>
<div class="item" onclick="go(2)"><span class="icon"></span>人员</div>
<div class="subnav subnav2">
<div onclick="go(2,0)">人员1</div>
<div onclick="go(2,1)">人员2</div>
</div>
</div>
<script src="https://cache.amap.com/lbs/static/es5.min.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script
src="https://webapi.amap.com/maps?v=1.4.15&key=ee7327615de4d673c4e455a772da45fd&plugin=Map3D,AMap.DistrictSearch,ElasticMarker,AMap.MarkerClusterer"></script>
<script src="https://webapi.amap.com/maps?v=1.4.15&key=ee7327615de4d673c4e455a772da45fd&plugin=Map3D,AMap.DistrictSearch,ElasticMarker,AMap.MarkerClusterer"></script>
<script src="https://webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script> -->
<!-- <script src="./js/utils.js?123"></script> -->
<style>
.amap-logo,.amap-copyright{opacity: 0;display: none!important;}
</style>
<script>
var i1 = 0, i2 = 0
function go(i1,i2){
$(".item").removeClass("active")
$(".item").eq(i1).addClass("active")
$(".subnav").hide()
$(".subnav"+i1).show()
$(".subnav"+i1).find("div").removeClass("active")
$(".subnav"+i1).find("div").eq(i2).addClass("active")
}
go(i1,i2)
</script>
<script language=javascript type=module>
//http://106.120.82.243:8080/qxyj/pageHtml/login.html wis 12379
import { Map3D } from './js/Map3D.js';
import { GetParams } from './js/tools.js';
var urlParams = GetParams()
//成都 重庆 天津 北京 上海 大连 三沙
window.map3d = new Map3D('成都','container',urlParams,(_map3d)=>{
window.map3d = new Map3D('佛山','container',urlParams,(_map3d)=>{
window.addPoiByApi('./personal.json')
});
window.review = function (params) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment