huaxia/htmls/contactUs/contactUs.html

184 lines
7.2 KiB
HTML
Raw Normal View History

2021-09-18 03:38:27 +00:00
<!DOCTYPE html>
<html lang="en">
<head>
2021-09-22 07:31:56 +00:00
2021-09-18 03:38:27 +00:00
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
2021-09-22 07:31:56 +00:00
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
2021-09-18 03:38:27 +00:00
<title>联系我们</title>
<link rel="stylesheet" type="text/css" href="../../css/swiper-bundle.min.css" />
<link rel="stylesheet" href="../../css/aboutUs.css">
<script src="../../js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
<script src="../../js/swiper-bundle.min.js" type="text/javascript" charset="utf-8"></script>
2021-09-22 07:31:56 +00:00
<script type="text/javascript" src="http://api.map.baidu.com/geocoder/v2/?ak=mDcZsWM7gGKb7MC1bC8Mo33FScjYEr0I&output=json&address=百度大厦&city=北京市"></script>
2021-09-18 03:38:27 +00:00
<title>地图展示</title>
<style type="text/css">
body,
html,
#allmap {
width: 100%;
height: 100%;
2021-09-22 08:13:07 +00:00
2021-09-18 03:38:27 +00:00
margin: 0;
font-family: "微软雅黑";
}
2021-09-22 07:31:56 +00:00
2021-09-18 09:46:18 +00:00
.foot-iframe {
width: 100%;
height: 400px;
}
2021-09-22 07:31:56 +00:00
2021-09-18 09:46:18 +00:00
.ty_topifrane {
2021-09-22 07:31:56 +00:00
width: 100%;
height: 285px;
}
.foot-iframe {
width: 100%;
height: 400px;
}
.ty_moban {
width: 100%;
box-shadow: 0px 3px 6px rgb(0 0 0 / 6%);
padding-bottom: 7px;
position: relative;
height: 2px;
z-index: 2;
}
2021-09-18 03:38:27 +00:00
</style>
</head>
<body>
<body>
2021-09-18 09:46:18 +00:00
<iframe src="../../public/center-head.html" class="ty_topifrane" frameborder="0" scrolling="no"></iframe>
<p class="ty_moban"></p>
2021-09-18 03:38:27 +00:00
<div class="ty_her ty_pd">
联系我们
</div>
<div class="mian ty_pd">
<div class="ty_lxmiancon">
<div class="ty_lxwo">
<p>华夏艺术网</p>
<p>地址四川省成都市武侯区天益街38号理想中心3栋601</p>
<p>手机13880548658</p>
<p>电话028-61529525</p>
<p>邮箱zarts@126.com</p>
</div>
<div class="ty_lxwx">
<img src="../../img/public/lx_wx.png" alt="">
<p>华夏艺术网</p>
</div>
<div class="ty_lxwo">
<p>成都惠民职工书院</p>
<p>地址成都市青羊区青羊大道129号文化宫2楼 </p>
<p>电话028-81712589</p>
</div>
<div class="ty_lxwxa">
<img src="../../img/public/lx_wx.png" alt="">
<p>华夏艺术网</p>
</div>
</div>
2021-09-22 07:31:56 +00:00
<div id="allmap" style="width: 100%;height: 470px;margin-top: 62px;"></div>
2021-09-18 03:38:27 +00:00
</div>
2021-09-18 09:46:18 +00:00
<iframe src="../../public/foot-tab.html" class="foot-iframe" frameborder="0" scrolling="no" marginwidth='0' marginheight='0'></iframe>
2021-09-18 03:38:27 +00:00
</body>
<script type="text/javascript">
2021-09-22 07:31:56 +00:00
function LoadBaiduMapScript() {
//console.log("初始化百度地图脚本...");
const AK = "mDcZsWM7gGKb7MC1bC8Mo33FScjYEr0I";
const BMap_URL = "https://api.map.baidu.com/api?v=2.0&ak=" + AK + "&s=1&callback=onBMapCallback";
return new Promise((resolve, reject) => {
// 如果已加载直接返回
if (typeof BMap !== "undefined") {
resolve(BMap);
return true;
}
// 百度地图异步加载回调处理
window.onBMapCallback = function () {
console.log("百度地图脚本初始化成功...");
resolve(BMap);
};
// 插入script脚本
let scriptNode = document.createElement("script");
scriptNode.setAttribute("type", "text/javascript");
scriptNode.setAttribute("src", BMap_URL);
document.body.appendChild(scriptNode);
});
}
2021-09-22 08:13:07 +00:00
LoadBaiduMapScript().then((BMap) => {
2021-09-22 07:31:56 +00:00
// 百度地图API功能
2021-09-22 08:13:07 +00:00
function SquareOverlay(center, length, color) {
this._center = center;
this._length = length;
this._color = color;
}
2021-09-22 07:31:56 +00:00
var map = new BMap.Map("allmap"); // 创建Map实例
2021-09-22 08:13:07 +00:00
map.centerAndZoom(new BMap.Point(104.067923463, 30.6799428454), 11); // 初始化地图,设置中心点坐标和地图级别
//添加地图类型控件
// 继承API的BMap.Overlay
SquareOverlay.prototype = new BMap.Overlay();
SquareOverlay.prototype.initialize = function (map) {
// 保存map对象实例
this._map = map;
// 创建div元素作为自定义覆盖物的容器
var div = document.createElement("div");
div.style.position = "absolute";
// 可以根据参数设置元素外观
div.style.width = this._length + "px";
div.style.height = this._length + "px";
div.style.background = this._color;
// 将div添加到覆盖物容器中
map.getPanes().markerPane.appendChild(div);
// 保存div实例
this._div = div;
// 需要将div元素作为方法的返回值当调用该覆盖物的show、
// hide方法或者对覆盖物进行移除时API都将操作此元素。
return div;
}
SquareOverlay.prototype.draw = function(){
// 根据地理坐标转换为像素坐标,并设置给容器
var position = this._map.pointToOverlayPixel(this._center);
this._div.style.left = position.x - this._length / 2 + "px";
this._div.style.top = position.y - this._length / 2 + "px";
}
SquareOverlay.prototype.show = function(){
if (this._div){
this._div.style.display = "";
}
}
// 实现隐藏方法
SquareOverlay.prototype.hide = function(){
if (this._div){
this._div.style.display = "none";
}
}
map.addControl(new BMap.MapTypeControl({
mapTypes: [
BMAP_NORMAL_MAP,
BMAP_HYBRID_MAP
]
}));
map.setCurrentCity("武汉"); // 设置地图显示的城市 此项是必须设置的
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
})
2021-09-18 03:38:27 +00:00
</script>
</html>