jyyhq/witDisplay/page/svg/ZH/svgZH_3.html

237 lines
18 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../../../js/core/jquery-3.6.0.js"></script>
<script src="../../../js/svg/jquery.svg.pan.zoom.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
#regionalInformations polyline{
cursor: pointer;
}
h1{
color: white;
position: fixed;
top: 5%;
left: 45%;
}
ul{
list-style-type: none;
font-size: 14px;
color: white;
position: fixed;
top: 28%;
right: 28%;
}
ul>li{
margin-bottom: 5%;
cursor: pointer;
}
ul>li:hover{
color: orange;
}
ul>li:first-child{
margin-bottom: 20%;
color: red;
}
ul>li:first-child:hover{
color: orange;
}
</style>
</head>
<body style="background-color: rgba(0,0,0,1)">
<svg id="svgBack" viewBox="-410 -500 2500 1700" version="1.1" width="1250" height="600" style="" preserveAspectRatio="xMinYMin meet" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
<!--<image x="-260" y="-90" width="1930" height="1135" xlink:href="../../img/mobileTurbofanGun/mapBackgroundImg_huainan.png"/>-->
<defs>
<filter id="f3" x="-110%" y="-110%" width="400%" height="400%">
<feOffset result="offOut" in="SourceGraphic" dx="0" dy="0"></feOffset>
<feGaussianBlur result="blurOut" in="offOut" stdDeviation="10"></feGaussianBlur>
<feBlend in="SourceGraphic" in2="blurOut" mode="multiply"></feBlend>
</filter>
</defs>
<path d="M1545.54 225.354H1462.1V2H1612.07V163.294M1584.47 225.354H1612.07V204.295" stroke="white" stroke-width="4"/>
<path d="M1585.26 226.011V181.341C1575.32 180.862 1553.36 189.126 1545.06 226.011" stroke="#36E7FF" stroke-width="4"/>
<path d="M112.401 250.881V2H1912V557.195H112.401V308.315" stroke="white" stroke-width="4"/>
<path d="M112.401 251.838V2H2V333.841H112.401V308.793" stroke="white" stroke-width="4"/>
<path d="M112.401 307.995L81.1448 307.995C80.8099 300.97 86.5923 285.457 112.401 279.597" stroke="#36E7FF" stroke-width="4"/>
<path d="M112.401 251.199L81.1448 251.199C80.8099 258.223 86.5923 273.737 112.401 279.597" stroke="#36E7FF" stroke-width="4"/>
<path d="M1612.07 225.036V251.998" stroke="white" stroke-width="4"/>
<path d="M1612.39 334.16V307.198" stroke="white" stroke-width="4"/>
<path d="M1612.39 307.996L1643.64 307.996C1643.98 300.971 1638.19 285.458 1612.39 279.598" stroke="#36E7FF" stroke-width="4"/>
<path d="M1612.39 251.2L1643.64 251.2C1643.98 258.224 1638.19 273.738 1612.39 279.598" stroke="#36E7FF" stroke-width="4"/>
<path d="M1612.07 203.976V225.354H1667.11H1707.15H1762.03V133.779V2H1612.07V164.092" stroke="white" stroke-width="4"/>
<path d="M537.413 225.354H561.982V2H112.082V225.354H497.528" stroke="white" stroke-width="4"/>
<path d="M537.732 226.011V181.341C527.787 180.862 505.824 189.126 497.528 226.011" stroke="#36E7FF" stroke-width="4"/>
<path d="M1612.07 204.296L1656.74 204.296C1657.22 194.351 1648.95 172.388 1612.07 164.092" stroke="#36E7FF" stroke-width="4"/>
<path d="M1407.69 225.354H1313.41V2H1462.1V225.354H1448.18" stroke="white" stroke-width="4"/>
<path d="M1216.3 225.354H1313.41V2H1160.25V225.354H1174.59" stroke="white" stroke-width="4"/>
<path d="M956.362 333.841H861.277V557.195L1017.31 557.195V333.841H997.204" stroke="white" stroke-width="4"/>
<path d="M581.446 333.841H562.62V557.195H860.639V333.841H637.603" stroke="white" stroke-width="4"/>
<path d="M580.807 333.842V365.098C587.832 365.433 603.345 359.65 609.205 333.842" stroke="#36E7FF" stroke-width="4"/>
<path d="M637.603 333.842L637.603 365.098C630.579 365.433 615.065 359.65 609.205 333.842" stroke="#36E7FF" stroke-width="4"/>
<path d="M581.446 225.354H562.62V2H860.639V225.354H637.603" stroke="white" stroke-width="4"/>
<path d="M580.807 225.355V194.098C587.832 193.764 603.345 199.546 609.205 225.355" stroke="#36E7FF" stroke-width="4"/>
<path d="M637.603 225.355L637.603 194.098C630.579 193.764 615.065 199.546 609.205 225.355" stroke="#36E7FF" stroke-width="4"/>
<path d="M1632.81 333.841H1613.98V557.195H1912V333.841H1688.96" stroke="white" stroke-width="4"/>
<path d="M1632.17 333.842V365.098C1639.19 365.433 1654.71 359.65 1660.57 333.842" stroke="#36E7FF" stroke-width="4"/>
<path d="M1688.96 333.842L1688.96 365.098C1681.94 365.433 1666.43 359.65 1660.57 333.842" stroke="#36E7FF" stroke-width="4"/>
<path d="M1334.79 333.841H1315.96V557.195H1613.98V333.841H1390.95" stroke="white" stroke-width="4"/>
<path d="M1334.15 333.842V365.098C1341.17 365.433 1356.69 359.65 1362.55 333.842" stroke="#36E7FF" stroke-width="4"/>
<path d="M1390.95 333.842L1390.95 365.098C1383.92 365.433 1368.41 359.65 1362.55 333.842" stroke="#36E7FF" stroke-width="4"/>
<path d="M1036.13 333.841H1017.31V557.195H1315.32V333.841H1092.29" stroke="white" stroke-width="4"/>
<path d="M1035.49 333.842V365.098C1042.52 365.433 1058.03 359.65 1063.89 333.842" stroke="#36E7FF" stroke-width="4"/>
<path d="M1092.29 333.842L1092.29 365.098C1085.26 365.433 1069.75 359.65 1063.89 333.842" stroke="#36E7FF" stroke-width="4"/>
<path d="M880.163 225.354H861.276V2H1160.25V225.354H936.501" stroke="white" stroke-width="4"/>
<path d="M879.522 225.355V194.098C886.569 193.764 902.133 199.546 908.011 225.355" stroke="#36E7FF" stroke-width="4"/>
<path d="M936.5 225.355L936.5 194.098C929.453 193.764 913.89 199.546 908.011 225.355" stroke="#36E7FF" stroke-width="4"/>
<path d="M537.509 333.86H562.301V557.215H112.401V333.86H497.78" stroke="white" stroke-width="4"/>
<rect x="1689.05" y="163.858" width="70.9833" height="59.4965" stroke="white" stroke-width="4"/>
<path d="M1175.09 165.049H1160.89" stroke="#00FF00" stroke-width="4"/>
<path d="M1312.77 165.049H1214.81" stroke="#00FF00" stroke-width="4"/>
<path d="M995.289 401.167H1016.67" stroke="#00FF00" stroke-width="4"/>
<path d="M861.915 401.167L955.245 401.167" stroke="#00FF00" stroke-width="4"/>
<path d="M1448.38 165.049H1461.46" stroke="#00FF00" stroke-width="4"/>
<path d="M1314.05 165.049H1409.13" stroke="#00FF00" stroke-width="4"/>
<path d="M537.732 334.16V378.831C527.787 379.31 505.824 371.046 497.528 334.16" stroke="#36E7FF" stroke-width="4"/>
<path d="M995.609 401.185V356.514C985.664 356.036 963.701 364.3 955.405 401.185" stroke="#36E7FF" stroke-width="4"/>
<path d="M1174.61 165.049V209.72C1184.56 210.199 1206.52 201.934 1214.81 165.049" stroke="#36E7FF" stroke-width="4"/>
<path d="M1449.02 165.049V209.72C1439.07 210.199 1417.11 201.934 1408.81 165.049" stroke="#36E7FF" stroke-width="4"/>
<g transform="translate(110,240)">
<path d="M31.25 7.8125V0H15.625V7.8125C8.28438 10.875 3.125 18.1156 3.125 26.5625C3.125 33.75 6.86875 40.05 12.5 43.6594C13.4906 44.2937 14.5281 44.8531 15.625 45.3125C18.0312 46.3156 20.6688 46.875 23.4375 46.875C26.2062 46.875 28.8438 46.3156 31.25 45.3125C32.3469 44.8563 33.3844 44.2937 34.375 43.6594C40.0063 40.05 43.75 33.7469 43.75 26.5625C43.75 18.1125 38.5906 10.875 31.25 7.8125ZM18.75 3.125H28.125V6.25H23.4375H18.75V3.125ZM23.4375 9.375C30.1 9.375 35.875 13.1938 38.7281 18.75H8.14688C11 13.1938 16.775 9.375 23.4375 9.375ZM31.25 41.8531C28.9031 43.0562 26.2531 43.75 23.4375 43.75C20.6219 43.75 17.9719 43.0562 15.625 41.8531V30.0125C15.625 28.9906 16.4906 28.125 17.5125 28.125H29.3625C30.3844 28.125 31.25 28.9906 31.25 30.0125V41.8531ZM34.375 39.8094V30.0125C34.375 27.2563 32.1187 25 29.3625 25H17.5125C14.7563 25 12.5 27.2563 12.5 30.0125V39.8094C8.68438 36.6563 6.25 31.8875 6.25 26.5625C6.25 24.9344 6.49063 23.3687 6.91563 21.875H39.9594C40.3844 23.3687 40.625 24.9344 40.625 26.5625C40.625 31.8875 38.1906 36.6563 34.375 39.8094ZM23.4375 31.25C20.85 31.25 18.75 33.35 18.75 35.9375C18.75 38.525 20.85 40.625 23.4375 40.625C26.025 40.625 28.125 38.525 28.125 35.9375C28.125 33.35 26.025 31.25 23.4375 31.25ZM23.4375 37.5C22.575 37.5 21.875 36.8 21.875 35.9375C21.875 35.075 22.575 34.375 23.4375 34.375C24.3 34.375 25 35.075 25 35.9375C25 36.8 24.3 37.5 23.4375 37.5Z" fill="#FFF175"/>
</g>
<g>
<g transform="translate(40,265)">
<path d="M8.22664 29.5387H3.03082L3.46372 23.0772L0 21.6926V42L3.0313 40.6154V33.6927L10.825 33.2315L14.7217 28.1546L10.825 25.3853L8.22664 29.5387ZM3.03082 14.7694L0.865807 17.0769L29.0104 36.4609L32.0413 36.9226L35.0726 31.3846L30.3096 34.1539L3.03082 14.7694ZM32.4742 31.3846L42 23.0767L9.52584 0H5.19582L0 8.30787V11.0772L29.8762 31.3846H32.4742Z" fill="#FFF175"/>
</g>
<g transform="translate(1560,240)">
<path d="M31.25 7.8125V0H15.625V7.8125C8.28438 10.875 3.125 18.1156 3.125 26.5625C3.125 33.75 6.86875 40.05 12.5 43.6594C13.4906 44.2937 14.5281 44.8531 15.625 45.3125C18.0312 46.3156 20.6688 46.875 23.4375 46.875C26.2062 46.875 28.8438 46.3156 31.25 45.3125C32.3469 44.8563 33.3844 44.2937 34.375 43.6594C40.0063 40.05 43.75 33.7469 43.75 26.5625C43.75 18.1125 38.5906 10.875 31.25 7.8125ZM18.75 3.125H28.125V6.25H23.4375H18.75V3.125ZM23.4375 9.375C30.1 9.375 35.875 13.1938 38.7281 18.75H8.14688C11 13.1938 16.775 9.375 23.4375 9.375ZM31.25 41.8531C28.9031 43.0562 26.2531 43.75 23.4375 43.75C20.6219 43.75 17.9719 43.0562 15.625 41.8531V30.0125C15.625 28.9906 16.4906 28.125 17.5125 28.125H29.3625C30.3844 28.125 31.25 28.9906 31.25 30.0125V41.8531ZM34.375 39.8094V30.0125C34.375 27.2563 32.1187 25 29.3625 25H17.5125C14.7563 25 12.5 27.2563 12.5 30.0125V39.8094C8.68438 36.6563 6.25 31.8875 6.25 26.5625C6.25 24.9344 6.49063 23.3687 6.91563 21.875H39.9594C40.3844 23.3687 40.625 24.9344 40.625 26.5625C40.625 31.8875 38.1906 36.6563 34.375 39.8094ZM23.4375 31.25C20.85 31.25 18.75 33.35 18.75 35.9375C18.75 38.525 20.85 40.625 23.4375 40.625C26.025 40.625 28.125 38.525 28.125 35.9375C28.125 33.35 26.025 31.25 23.4375 31.25ZM23.4375 37.5C22.575 37.5 21.875 36.8 21.875 35.9375C21.875 35.075 22.575 34.375 23.4375 34.375C24.3 34.375 25 35.075 25 35.9375C25 36.8 24.3 37.5 23.4375 37.5Z" fill="#FFF175"/>
</g>
<g transform="translate(1860,290)">
<path d="M8.22664 29.5387H3.03082L3.46372 23.0772L0 21.6926V42L3.0313 40.6154V33.6927L10.825 33.2315L14.7217 28.1546L10.825 25.3853L8.22664 29.5387ZM3.03082 14.7694L0.865807 17.0769L29.0104 36.4609L32.0413 36.9226L35.0726 31.3846L30.3096 34.1539L3.03082 14.7694ZM32.4742 31.3846L42 23.0767L9.52584 0H5.19582L0 8.30787V11.0772L29.8762 31.3846H32.4742Z" fill="#FFF175"/>
</g>
<!--
作者726475269@qq.com
时间2023-07-13
描述:图例
-->
<g transform="translate(-400,100)">
<path d="M8.22664 29.5387H3.03082L3.46372 23.0772L0 21.6926V42L3.0313 40.6154V33.6927L10.825 33.2315L14.7217 28.1546L10.825 25.3853L8.22664 29.5387ZM3.03082 14.7694L0.865807 17.0769L29.0104 36.4609L32.0413 36.9226L35.0726 31.3846L30.3096 34.1539L3.03082 14.7694ZM32.4742 31.3846L42 23.0767L9.52584 0H5.19582L0 8.30787V11.0772L29.8762 31.3846H32.4742Z" fill="#FFF175"/>
<text transform="translate(60,35) rotate(0)" style="font-size:22pt;color:#ffffff;" fill="#ffffff">
网络枪式摄像机
</text>
</g>
<g transform="translate(-400,250)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.19529 7.87798C1.80933 7.69015 1.45345 7.43833 1.14411 7.12933C0.41155 6.39757 0 5.40508 0 4.37021V3.90198C0 2.86711 0.41155 1.87462 1.14411 1.14286C1.87668 0.4111 2.87025 0 3.90625 0H36.0938C37.1298 0 38.1234 0.4111 38.8559 1.14286C39.5885 1.87462 40 2.86711 40 3.90198V4.37021C40 5.40508 39.5885 6.39757 38.8559 7.12933C38.5322 7.45271 38.1574 7.71347 37.7506 7.90381C37.8734 8.28573 37.9375 8.68773 37.9375 9.09628V22.0509C37.9375 24.408 37.4727 26.742 36.5697 28.9197C35.6667 31.0974 34.3431 33.0761 32.6746 34.7428C31.006 36.4095 29.0252 37.7316 26.8451 38.6337C24.665 39.5357 22.3284 40 19.9687 40C15.2031 40 10.6327 38.1089 7.26293 34.7428C3.89313 31.3767 2 26.8113 2 22.0509V9.09628C2 8.67853 2.06708 8.26757 2.19529 7.87798ZM3.35382 3.35015C3.50034 3.2038 3.69905 3.12159 3.90625 3.12159H36.0938C36.301 3.12159 36.4997 3.2038 36.6462 3.35015C36.7927 3.49651 36.875 3.69501 36.875 3.90198V4.37021C36.875 4.57719 36.7927 4.77569 36.6462 4.92204C36.4997 5.0684 36.301 5.15061 36.0938 5.15061H3.90625C3.69905 5.15061 3.50034 5.0684 3.35382 4.92204C3.20731 4.77569 3.125 4.57719 3.125 4.37021V3.90198C3.125 3.69501 3.20731 3.49651 3.35382 3.35015ZM5.35382 8.54445C5.50034 8.39813 5.69905 8.31589 5.90625 8.31589H34.0313C34.2385 8.31589 34.4372 8.39813 34.5837 8.54445C34.7302 8.69085 34.8125 8.88933 34.8125 9.09628V22.0509C34.8125 25.9444 33.3132 29.4856 30.8594 32.1301V26.0653C30.8594 23.1934 29.7174 20.4393 27.6845 18.4086C25.6516 16.378 22.8944 15.2372 20.0195 15.2372C17.1446 15.2372 14.3874 16.378 12.3546 18.4086C10.3218 20.4393 9.17968 23.1934 9.17968 26.0653V32.2385C6.66574 29.5827 5.125 25.9978 5.125 22.0509V9.09628C5.125 8.88933 5.20731 8.69085 5.35382 8.54445ZM27.7344 26.0653V34.6925C25.4758 36.0791 22.8164 36.8784 19.9687 36.8784C17.1637 36.8784 14.5413 36.1027 12.3047 34.7543V26.0653C12.3047 21.8511 15.8203 18.3783 20.039 18.3783C24.2578 18.3783 27.7344 21.8121 27.7344 26.0653ZM14.0625 26.1042C14.0625 29.3819 16.7187 32.0352 20 32.0352C23.2813 32.0352 25.9375 29.3819 25.9375 26.1042C25.9375 22.8266 23.2813 20.1732 20 20.1732C16.7187 20.1732 14.0625 22.8266 14.0625 26.1042ZM18.4374 23.7293C18.9 23.4205 19.4438 23.2558 20 23.2558C20.7459 23.2558 21.4613 23.5518 21.9887 24.0786C22.5162 24.6055 22.8125 25.3201 22.8125 26.0653C22.8125 26.6209 22.6475 27.1641 22.3385 27.6261C22.0294 28.088 21.5902 28.4481 21.0763 28.6608C20.5624 28.8734 19.9969 28.9291 19.4513 28.8207C18.9058 28.7123 18.4046 28.4447 18.0113 28.0518C17.6179 27.6589 17.3501 27.1583 17.2415 26.6133C17.133 26.0684 17.1887 25.5034 17.4016 24.9901C17.6145 24.4768 17.975 24.038 18.4374 23.7293Z" fill="#FFF175"/>
<text transform="translate(60,35) rotate(0)" style="font-size:22pt;color:#ffffff;" fill="#ffffff">
室内网络快速球机
</text>
</g>
<g transform="translate(-400,400)">
<path d="M31.25 7.8125V0H15.625V7.8125C8.28438 10.875 3.125 18.1156 3.125 26.5625C3.125 33.75 6.86875 40.05 12.5 43.6594C13.4906 44.2937 14.5281 44.8531 15.625 45.3125C18.0312 46.3156 20.6688 46.875 23.4375 46.875C26.2062 46.875 28.8438 46.3156 31.25 45.3125C32.3469 44.8563 33.3844 44.2937 34.375 43.6594C40.0063 40.05 43.75 33.7469 43.75 26.5625C43.75 18.1125 38.5906 10.875 31.25 7.8125ZM18.75 3.125H28.125V6.25H23.4375H18.75V3.125ZM23.4375 9.375C30.1 9.375 35.875 13.1938 38.7281 18.75H8.14688C11 13.1938 16.775 9.375 23.4375 9.375ZM31.25 41.8531C28.9031 43.0562 26.2531 43.75 23.4375 43.75C20.6219 43.75 17.9719 43.0562 15.625 41.8531V30.0125C15.625 28.9906 16.4906 28.125 17.5125 28.125H29.3625C30.3844 28.125 31.25 28.9906 31.25 30.0125V41.8531ZM34.375 39.8094V30.0125C34.375 27.2563 32.1187 25 29.3625 25H17.5125C14.7563 25 12.5 27.2563 12.5 30.0125V39.8094C8.68438 36.6563 6.25 31.8875 6.25 26.5625C6.25 24.9344 6.49063 23.3687 6.91563 21.875H39.9594C40.3844 23.3687 40.625 24.9344 40.625 26.5625C40.625 31.8875 38.1906 36.6563 34.375 39.8094ZM23.4375 31.25C20.85 31.25 18.75 33.35 18.75 35.9375C18.75 38.525 20.85 40.625 23.4375 40.625C26.025 40.625 28.125 38.525 28.125 35.9375C28.125 33.35 26.025 31.25 23.4375 31.25ZM23.4375 37.5C22.575 37.5 21.875 36.8 21.875 35.9375C21.875 35.075 22.575 34.375 23.4375 34.375C24.3 34.375 25 35.075 25 35.9375C25 36.8 24.3 37.5 23.4375 37.5Z" fill="#FFF175"/>
<text transform="translate(60,35) rotate(0)" style="font-size:22pt;color:#ffffff;" fill="#ffffff">
室内网络半球摄像机
</text>
</g>
<h1>综合楼3层</h1>
<ul id="floor">
<li id="goBack">返回</li>
<li>7 层</li>
<li>6 层</li>
<li>5 层</li>
<li>4 层</li>
<li style="color: orange;">3 层</li>
<li>2 层</li>
<li>1 层</li>
<li>地下室</li>
</ul>
</svg>
<script>
$(function(){
//缩放、拖动
var svgContent = $("svg");
var options = {
events: {
mouseWheel: true,
doubleClick: false,
drag: true,
dragCursor: "move"
},
animationTime: 0,
zoomFactor: 0.1,
initialViewBox: {
x: 500,
y: -500,
width: 1700,
height: 1700
}
}
svgPanZoom = svgContent.svgPanZoom(options);
$("#regionalInformations polyline").on({
mouseover : function(){
$(this).attr("fill","rgba(255,165,0,0.1)") ;
$(this).attr("stroke","rgba(255,165,0,1)");
} ,
mouseout : function(){
$(this).attr("fill","rgba(255,165,0,0)") ;
$(this).attr("stroke","rgba(255,165,0,0)");
}
}) ;
$("#floor li").on({
click : function(){
var floorName = $(this).text()
var fileName = ''
if(floorName == '地下室'){
fileName = 'svgZH_0.html'
}
if(floorName == '1 层'){
fileName = 'svgZH_1.html'
}
if(floorName == '2 层'){
fileName = 'svgZH_2.html'
}
if(floorName == '3 层'){
fileName = 'svgZH_3.html'
}
if(floorName == '4 层'){
fileName = 'svgZH_4.html'
}
if(floorName == '5 层'){
fileName = 'svgZH_5.html'
}
if(floorName == '6 层'){
fileName = 'svgZH_6.html'
}
if(floorName == '7 层'){
fileName = 'svgZH_7.html'
}
if(floorName == '8 层'){
fileName = 'svgZH_8.html'
}
$("#map").load('../../page/svg/ZH/' + fileName);
}
})
$('#goBack').on({
click : function(){
$("#map").load('../../page/svg/svgMap.html');
}
})
$(document).keyup(function(event){
if(event.keyCode == 27){
$("#map").load('../../page/svg/svgMap.html');
}
});
});
</script>
</body>
</html>