lizixuan
/
webs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

汉晶删除3个产品案例、添加地图组件

This commit is contained in:
yaoqin 2025-04-25 17:18:01 +08:00
parent 461fed6bd6
commit d64ed43221
4 changed files with 186 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
hanJing/css/aboutUs.css
View File

@ -62,7 +62,7 @@
.banner{
width: 100%;
height: 314vh;
height: 400vh;
background-image: url(../imgs/svg/背景纹（大）.svg);
background-repeat: no-repeat;
background-size:160%;
@ -224,3 +224,33 @@
top: 0vh;
left: 20vw;
}
/* --------------- */
.map{
width: 100%;
height: 100vh;
/* background: palegoldenrod; */
}
.addressBox-bottom{
width: 55vw;
height: 55vh;
margin: 0 auto;
position: relative;
margin-top: 10vh;
}
#mapContainer {
width: 100%;
height: 100%;
min-height: 300px; /* 确保地图有最小高度 */
}

25
hanJing/html/aboutUs.html
View File

@ -8,6 +8,13 @@
<link rel="stylesheet" href="../css/base.css">
<link rel="stylesheet" href="../css/footer.css">
<link rel="stylesheet" href="../css/header.css">
<script>
window._AMapSecurityConfig = {
securityJsCode: 'd7d163684cbe3ea85f182a42cd1b8880',
}
</script>
<script src="https://webapi.amap.com/maps?v=2.0&key=d8d0391f0356497ccdc1c0f13d4a8c33&callback=initMap"></script>
<script src="../js/aboutUs.js"></script>
<title>深圳汉晶电子信息有限公司</title>
</head>
<body>
@ -108,8 +115,26 @@
</ul>
</div>
<section class="map">
<div class="addressBox-bottom">
<div id="mapContainer"></div>
</div>
</section>
</section>
<footer class="footer" style=" background-color: #020A4C !important; ">
<section class="emailBox">
<div class="emailLeft">

30
hanJing/html/ourProducts.html
View File

@ -89,22 +89,22 @@
<img src="../imgs/products/XYV2.png" alt="KS6PRO运算加速芯片">
<p>XYV2 红外图像处理芯片</p>
</div>
<div class="product-item" data-product="NAVT1">
<!-- <div class="product-item" data-product="NAVT1">
<img src="../imgs/products/NAVT1.png" alt="KS6PRO运算加速芯片">
<p>NAVT1 自动驾驶视觉处理芯片</p>
</div>
<div class="product-item" data-product="BIOX1">
</div> -->
<!-- <div class="product-item" data-product="BIOX1">
<img src="../imgs/products/BIOX1.png" alt="KS6PRO运算加速芯片">
<p>BIOX1 指纹识别芯片</p>
</div>
</div> -->
<div class="product-item" data-product="SND32">
<img src="../imgs/products/SND32.png" alt="KS6PRO运算加速芯片">
<p>SND32 高保真音频处理芯片</p>
</div>
<div class="product-item" data-product="WIFI6-UC">
<!-- <div class="product-item" data-product="WIFI6-UC">
<img src="../imgs/products/WIFI6-UC.png" alt="KS6PRO运算加速芯片">
<p>WIFI6-UC 通信协议芯片</p>
</div>
</div> -->
<div class="product-item" data-product="AGRO1">
<img src="../imgs/products/AGRO1.png" alt="KS6PRO运算加速芯片">
<p>AGRO1 农业环境监测芯片</p>
@ -226,34 +226,34 @@
</div>
</div>
</div>
<div class="detail-content" id="NAVT1" style="display: none;">
<!-- <div class="detail-content" id="NAVT1" style="display: none;">
<div class="detail-image">
<img src="../imgs/products/NAVT1.png" alt="NAVT1">
</div>
<div class="detail-info">
<h2>NAVT1 自动驾驶视觉处理芯片</h2>
<div class="info-list">
<!-- <p>客户需求：自动识别障碍物与车道线，适配自动驾驶系统。</p> -->
<p>解决方案：内置神经网络引擎、图像识别模块，支持 CAN 通信。</p>
<p>技术亮点：支持 YOLOv5，识别延迟低，集成 IMU 实现高精度导航。</p>
</div>
</div>
</div>
<div class="detail-content" id="BIOX1" style="display: none;">
</div> -->
<!-- <div class="detail-content" id="BIOX1" style="display: none;">
<div class="detail-image">
<img src="../imgs/products/BIOX1.png" alt="BIOX1">
</div>
<div class="detail-info">
<h2>BIOX1 指纹识别芯片</h2>
<div class="info-list">
<!-- <p>客户需求：智能门锁中实现快速安全的指纹识别。</p> -->
<p>解决方案：内置光学传感器接口与指纹模板引擎，支持超低功耗待机。</p>
<p>技术亮点：活体检测支持，0.3s 识别时间，极低误识率。</p>
</div>
</div>
</div>
</div> -->
<div class="detail-content" id="SND32" style="display: none;">
<div class="detail-image">
<img src="../imgs/products/SND32.png" alt="SND32">
@ -268,20 +268,20 @@
</div>
</div>
</div>
<div class="detail-content" id="WIFI6-UC" style="display: none;">
<!-- <div class="detail-content" id="WIFI6-UC" style="display: none;">
<div class="detail-image">
<img src="../imgs/products/WIFI6-UC.png" alt="WIFI6-UC">
</div>
<div class="detail-info">
<h2>WIFI6-UC 通信协议芯片</h2>
<div class="info-list">
<!-- <p>客户需求：升级路由器至 Wi-Fi 6 并支持多设备高速连接。</p> -->
<p>解决方案：实现 OFDMA、MU-MIMO 与 BSS Coloring，优化多终端通信。</p>
<p>技术亮点：支持双频并发，吞吐率达 9.6Gbps，节能设计优秀。</p>
</div>
</div>
</div>
</div> -->
<div class="detail-content" id="AGRO1" style="display: none;">
<div class="detail-image">
<img src="../imgs/products/AGRO1.png" alt="AGRO1">

114
hanJing/js/aboutUs.js Normal file
View File

@ -0,0 +1,114 @@
function initAMap() {
try {
// 更新为完整地址
const address = '广东省深圳市南山区粤海街道麻岭社区麻雀岭工业区M-6栋中钢大厦5A010';
const companyName = '深圳汉晶电子信息有限公司';
// 创建地图实例
let map = null;
// 地址解析
AMap.plugin('AMap.Geocoder', function() {
const geocoder = new AMap.Geocoder({
city: "深圳",
radius: 1000
});
geocoder.getLocation(address, function(status, result) {
if (status === 'complete' && result.info === 'OK') {
const lnglat = result.geocodes[0].location;
map = new AMap.Map('mapContainer', {
zoom: 16,
center: [lnglat.lng, lnglat.lat],
viewMode: '3D',
resizeEnable: true,
pitch: 40,
mapStyle: 'amap://styles/normal'
});
// 更新标记信息
const marker = new AMap.Marker({
position: [lnglat.lng, lnglat.lat],
title: companyName,
animation: 'AMAP_ANIMATION_DROP',
offset: new AMap.Pixel(-13, -30)
});
map.add(marker);
// 更新信息窗体内容
const content = `
<div class="info-content" style="padding: 15px;">
<h4 style="margin: 0 0 10px 0; color: #100B4E; font-size: 16px;">${companyName}</h4>
<p style="margin: 0 0 8px 0; font-size: 13px;color: #100B4E;">
<strong>地址：</strong>${address}
</p>
<p style="margin: 0 0 8px 0; font-size: 13px; color: #100B4E;">
<strong>电话：</strong>13420976989
</p>
<p style="margin: 0; font-size: 13px; color: #100B4E;">
<strong>Email：</strong>fu.bin@hjsilicon.com
</p>
</div>
`;
// 创建信息窗体
const infoWindow = new AMap.InfoWindow({
content: content,
offset: new AMap.Pixel(0, -30),
closeWhenClickMap: true
});
// 地图加载完成后打开信息窗体
map.on('complete', function() {
infoWindow.open(map, [lnglat.lng, lnglat.lat]);
});
// 点击标记时打开信息窗体
marker.on('click', function() {
infoWindow.open(map, marker.getPosition());
});
// 添加控件
map.addControl(new AMap.ToolBar({
position: 'RB'
}));
map.addControl(new AMap.Scale());
// 确保标记点居中显示
map.setFitView([marker]);
// 响应式处理
window.addEventListener('resize', function() {
map.resize();
map.setCenter([lnglat.lng, lnglat.lat]);
});
} else {
console.error('地址解析失败:', result);
document.getElementById('mapContainer').innerHTML =
'<div style="text-align:center;padding:20px;color:#f00;">地址定位失败，请刷新重试</div>';
}
});
});
} catch (error) {
console.error('地图初始化失败:', error);
document.getElementById('mapContainer').innerHTML =
'<div style="text-align:center;padding:20px;color:#f00;">地图加载失败，请刷新重试</div>';
}
}
// DOM加载完成时初始化
document.addEventListener('DOMContentLoaded', function() {
if (typeof AMap !== 'undefined') {
initAMap();
}
});
// 回调函数
window.initMap = function() {
if (typeof AMap !== 'undefined') {
initAMap();
}
};