Compare commits
2 Commits
461fed6bd6
...
01fbdf71a6
Author | SHA1 | Date |
---|---|---|
|
01fbdf71a6 | |
|
d64ed43221 |
|
@ -62,7 +62,7 @@
|
|||
|
||||
.banner{
|
||||
width: 100%;
|
||||
height: 314vh;
|
||||
height: 205vh;
|
||||
background-image: url(../imgs/svg/背景纹(大).svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size:160%;
|
||||
|
@ -223,4 +223,47 @@
|
|||
position: absolute;
|
||||
top: 0vh;
|
||||
left: 20vw;
|
||||
}
|
||||
}
|
||||
|
||||
/* --------------- */
|
||||
.map{
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
/* background: palegoldenrod; */
|
||||
background-color:rgba(3, 0, 69, 0.8);
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.addressBox-bottom{
|
||||
width: 55vw;
|
||||
height: 55vh;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
margin-top: 10vh;
|
||||
|
||||
}
|
||||
|
||||
#mapContainer {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 300px; /* 确保地图有最小高度 */
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth; /* 添加平滑滚动效果 */
|
||||
}
|
||||
|
||||
#contact-map {
|
||||
scroll-margin-top: 10vh;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -319,13 +319,97 @@ body {
|
|||
|
||||
.banner{
|
||||
width: 100%;
|
||||
height: 330vh;
|
||||
height: 520vh;
|
||||
background-image: url(../imgs/svg/背景纹(大).svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size:160%;
|
||||
background-position: 54vw -42vw;
|
||||
background-color: #00316B;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.bannerBottom2{
|
||||
width: 100%;
|
||||
height: 190vh;
|
||||
background-color:rgba(3, 0, 69, 0.8);
|
||||
padding-top: 8vh;
|
||||
padding-bottom: 8vh;
|
||||
/* background: palegoldenrod; */
|
||||
|
||||
}
|
||||
|
||||
.bannerBottom2 h1{
|
||||
font-size: 3vw;
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.8vw;
|
||||
|
||||
}
|
||||
.bannerBottomList{
|
||||
width: 72vw;
|
||||
height:150vh;
|
||||
/* background: palegoldenrod; */
|
||||
margin: 0 auto;
|
||||
margin-top: 8vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.bannerBottomList li{
|
||||
width: 70%;
|
||||
height:60vh;
|
||||
margin-top: 10vh;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.bannerBottomList li p{
|
||||
width: 40%;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: end;
|
||||
align-items: start;
|
||||
padding-bottom: 3vh;
|
||||
font-size: 1.2vw;
|
||||
padding-left: 4vw;
|
||||
}
|
||||
.bannerBottomListOne{
|
||||
background-image: url(../imgs/us/ic.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: auto;
|
||||
height: 100%;
|
||||
/* background: palegoldenrod; */
|
||||
}
|
||||
.bannerBottomListTwo{
|
||||
background-image: url(../imgs/us/lowpower.png);
|
||||
background-repeat: no-repeat;
|
||||
/* background-size: 100% 100%; */
|
||||
background-size: contain; /* 改为 contain 保持图片比例 */
|
||||
background-position: center; /* 居中显示 */
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.bannerBottomListThree{
|
||||
background-image: url(../imgs/us/manufacturer.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.bannerBottomListFour{
|
||||
background-image: url(../imgs/us/Tapeout.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* .bannerLeft{
|
||||
width: 100%;
|
||||
height: 30%;
|
||||
|
|
|
@ -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>
|
||||
|
@ -85,7 +92,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bannerBottom">
|
||||
<!-- <div class="bannerBottom">
|
||||
<h1>为什么选择汉晶?</h1>
|
||||
<ul class="bannerBottomList">
|
||||
<li class="bannerBottomListOne">
|
||||
|
@ -107,9 +114,27 @@
|
|||
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
|
||||
<section class="map">
|
||||
|
||||
<div class="addressBox-bottom" id="contact-map">
|
||||
<div id="mapContainer"></div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<footer class="footer" style=" background-color: #020A4C !important; ">
|
||||
<section class="emailBox">
|
||||
<div class="emailLeft">
|
||||
|
|
|
@ -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">
|
||||
|
|
|
@ -56,7 +56,7 @@
|
|||
</div>
|
||||
<p class="title">技术咨询</p>
|
||||
<p class="problem">提供芯片设计前的需求分析、技术选型、系统架构建议。</p>
|
||||
<a class="report" href="mailto:fu.bin@hjsilicon.com">提交服务帮助 <img class="arrow" src="../imgs/svg/箭头.svg" alt="箭头"></a>
|
||||
<a class="report" href="aboutUs.html#contact-map">提交服务帮助 <img class="arrow" src="../imgs/svg/箭头.svg" alt="箭头"></a>
|
||||
|
||||
</div>
|
||||
|
||||
|
@ -66,7 +66,7 @@
|
|||
</div>
|
||||
<p class="title">定制化开发</p>
|
||||
<p class="problem">根据客户的特定需求,提供个性化定制的芯片设计服务,确保项目的高效实施。</p>
|
||||
<a class="report" href="mailto:fu.bin@hjsilicon.com">定制需求 <img class="arrow" src="../imgs/svg/箭头.svg" alt="箭头"></a>
|
||||
<a class="report" href="aboutUs.html#contact-map">定制需求 <img class="arrow" src="../imgs/svg/箭头.svg" alt="箭头"></a>
|
||||
|
||||
</div>
|
||||
<div class="bannerRight">
|
||||
|
@ -76,7 +76,7 @@
|
|||
</div>
|
||||
<p class="title">产品维护与升级</p>
|
||||
<p class="problem">提供持续的技术支持,定期为客户的芯片产品提供性能优化与功能升级。</p>
|
||||
<a class="report" href="mailto:fu.bin@hjsilicon.com">立即升级 <img class="arrow" src="../imgs/svg/箭头.svg" alt="箭头"></a>
|
||||
<a class="report" href="aboutUs.html#contact-map">立即升级 <img class="arrow" src="../imgs/svg/箭头.svg" alt="箭头"></a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -83,6 +83,33 @@
|
|||
<img class="btRight" src="./imgs/svg/线纹.svg" alt="点纹">
|
||||
</section>
|
||||
<section class="banner">
|
||||
|
||||
<div class="bannerBottom2">
|
||||
<h1>为什么选择汉晶?</h1>
|
||||
<ul class="bannerBottomList">
|
||||
<li class="bannerBottomListOne">
|
||||
<p></p>
|
||||
<p> IC设计全生命周期一站式覆盖 </p>
|
||||
</li>
|
||||
<li class="bannerBottomListTwo">
|
||||
<p>独特的低功耗设计,让芯片更有竞争力</p>
|
||||
<p></p>
|
||||
</li>
|
||||
<li class="bannerBottomListThree">
|
||||
<p></p>
|
||||
<p>有稳定的芯片制造商合作关系</p>
|
||||
</li>
|
||||
<li class="bannerBottomListFour">
|
||||
<p>流片均一版成功,即流片成功率100%,助力客户赢得市场</p>
|
||||
<p></p>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="bannertop">
|
||||
<div class="textBox">
|
||||
<h1>芯片设计技术服务</h1>
|
||||
|
|
|
@ -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();
|
||||
}
|
||||
};
|
Loading…
Reference in New Issue