568 lines
11 KiB
CSS
568 lines
11 KiB
CSS
/*!
|
||
* xjsdk
|
||
* 版本信息:v1.0.1, hash值: 549ed36da56d90ce3e77
|
||
* 编译日期:2025-3-3 00:31:16
|
||
* 版权所有:Copyright by wmj
|
||
*
|
||
*/
|
||
.cesium-container,
|
||
.xjsdk-container {
|
||
width: 100%;
|
||
height: 100%;
|
||
margin: 0;
|
||
padding: 0;
|
||
overflow: hidden;
|
||
position: relative;
|
||
}
|
||
.xjsdk-locationbar {
|
||
position: absolute;
|
||
z-index: 991;
|
||
padding: 3px 10px;
|
||
font-size: 13px;
|
||
color: #e9e9e9;
|
||
text-shadow: 2px 2px 2px #000;
|
||
background-color: rgba(0, 0, 0, 0.4);
|
||
pointer-events: none;
|
||
}
|
||
.xjsdk-locationbar-content {
|
||
float: right;
|
||
}
|
||
.xjsdk-locationbar-content div {
|
||
float: left;
|
||
margin-right: 30px;
|
||
}
|
||
@media screen and (max-width: 600px) {
|
||
.xjsdk-locationbar {
|
||
display: none;
|
||
}
|
||
}
|
||
.xjsdk-mousezoom {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 40px;
|
||
height: 40px;
|
||
margin-top: -23px;
|
||
margin-left: -23px;
|
||
pointer-events: none;
|
||
visibility: hidden;
|
||
opacity: 0;
|
||
-webkit-transition:
|
||
visibility 0s 0.2s,
|
||
opacity 0.2s ease-in;
|
||
-moz-transition:
|
||
visibility 0s 0.2s,
|
||
opacity 0.2s ease-in;
|
||
transition:
|
||
visibility 0s 0.2s,
|
||
opacity 0.2s ease-in;
|
||
}
|
||
.xjsdk-mousezoom .zoomimg {
|
||
width: 36px;
|
||
height: 36px;
|
||
background-image: url(img/cursor.png);
|
||
background-size: 100% 100%;
|
||
}
|
||
.xjsdk-mousezoom-visible {
|
||
visibility: visible;
|
||
opacity: 1;
|
||
-webkit-transition: opacity 0.2s ease-out;
|
||
-moz-transition: opacity 0.2s ease-out;
|
||
transition: opacity 0.2s ease-out;
|
||
}
|
||
.xjsdk-popup {
|
||
left: 0;
|
||
top: 5px;
|
||
}
|
||
.xjsdk-popup,
|
||
.xjsdk-popup-close-button {
|
||
position: absolute;
|
||
text-align: center;
|
||
z-index: 9999;
|
||
}
|
||
.xjsdk-popup-close-button {
|
||
top: 0;
|
||
right: 0;
|
||
padding: 4px 4px 0 0;
|
||
width: 18px;
|
||
height: 14px;
|
||
font:
|
||
16px/14px Tahoma,
|
||
Verdana,
|
||
sans-serif;
|
||
text-decoration: none;
|
||
font-weight: 700;
|
||
background: transparent;
|
||
}
|
||
.xjsdk-popup-content-wrapper {
|
||
text-align: center;
|
||
max-height: 500px;
|
||
overflow-y: auto;
|
||
box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
|
||
padding: 1px;
|
||
text-align: left;
|
||
border-radius: 3px;
|
||
}
|
||
.xjsdk-popup-content {
|
||
margin: 10px;
|
||
line-height: 1.4;
|
||
font-size: 13px;
|
||
max-width: 800px;
|
||
min-width: 50px;
|
||
}
|
||
.xjsdk-popup-tip-container {
|
||
margin: 0 auto;
|
||
width: 40px;
|
||
height: 20px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
.xjsdk-popup-tip {
|
||
box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
|
||
width: 17px;
|
||
height: 17px;
|
||
padding: 1px;
|
||
margin: -10px auto 0;
|
||
-webkit-transform: rotate(45deg);
|
||
-moz-transform: rotate(45deg);
|
||
-ms-transform: rotate(45deg);
|
||
-o-transform: rotate(45deg);
|
||
transform: rotate(45deg);
|
||
}
|
||
.xjsdk-popup-color {
|
||
color: #fff;
|
||
}
|
||
.xjsdk-popup-background {
|
||
/* background: rgba(63, 72, 84, 0.9); */
|
||
background: linear-gradient(180deg, rgba(0, 21, 30, 1) 0%, rgba(0, 87, 113, 1) 100%);
|
||
}
|
||
.xjsdk-popup-titile {
|
||
border-radius: 3px 0 0 3px;
|
||
padding: 0 80px 0 10px;
|
||
height: 40px;
|
||
line-height: 40px;
|
||
font-size: 16px;
|
||
color: #fff;
|
||
border-bottom: 1px solid #616161;
|
||
overflow: hidden;
|
||
}
|
||
.xjsdk-popup-content {
|
||
min-width: 150px;
|
||
margin-top: 12px;
|
||
font-size: 14px;
|
||
}
|
||
.xjsdk-popup-content label {
|
||
margin: 0 10px;
|
||
min-width: 50px;
|
||
}
|
||
.xjsdk-popup-content > div {
|
||
margin-top: 5px;
|
||
}
|
||
.xjsdk-draw-tooltip {
|
||
display: block;
|
||
position: absolute;
|
||
visibility: visible;
|
||
max-width: 200px;
|
||
min-width: 100px;
|
||
padding: 2px 5px;
|
||
font-size: 11px;
|
||
z-index: 1000;
|
||
opacity: 0.8;
|
||
-khtml-opacity: 0.8;
|
||
-moz-opacity: 0.8;
|
||
filter: alpha(opacity=80);
|
||
pointer-events: none;
|
||
}
|
||
.xjsdk-draw-tooltip.left .xjsdk-draw-tooltip-arrow {
|
||
top: 50%;
|
||
right: 0;
|
||
margin-top: -5px;
|
||
border-top: 5px solid transparent;
|
||
border-bottom: 5px solid transparent;
|
||
border-left: 5px solid #000;
|
||
}
|
||
.xjsdk-draw-tooltip.right .xjsdk-draw-tooltip-arrow {
|
||
top: 50%;
|
||
left: 0;
|
||
margin-top: -5px;
|
||
border-top: 5px solid transparent;
|
||
border-bottom: 5px solid transparent;
|
||
border-right: 5px solid #000;
|
||
}
|
||
.xjsdk-draw-tooltip-inner {
|
||
padding: 3px 5px;
|
||
background-color: rgba(0, 0, 0, 0.8);
|
||
color: #fff;
|
||
text-align: left;
|
||
max-width: 200px;
|
||
text-decoration: none;
|
||
-webkit-border-radius: 4px;
|
||
-moz-border-radius: 4px;
|
||
border-radius: 4px;
|
||
}
|
||
.xjsdk-draw-tooltip-inner p {
|
||
margin: 0;
|
||
}
|
||
.xjsdk-draw-tooltip-arrow {
|
||
position: absolute;
|
||
width: 0;
|
||
height: 0;
|
||
}
|
||
.xjsdk-contextmenu {
|
||
position: absolute;
|
||
padding: 0;
|
||
z-index: 999;
|
||
display: none;
|
||
}
|
||
.xjsdk-contextmenu-ul i {
|
||
padding-right: 10px;
|
||
min-width: 20px;
|
||
text-align: center;
|
||
}
|
||
.xjsdk-contextmenu-ul {
|
||
background: rgba(43, 44, 47, 0.8);
|
||
border: 1px solid #2b2c2f;
|
||
min-width: 110px;
|
||
list-style: none;
|
||
}
|
||
.xjsdk-contextmenu-ul,
|
||
.xjsdk-contextmenu-ul li + li {
|
||
position: relative;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
.xjsdk-contextmenu-ul li + li:before {
|
||
content: "";
|
||
display: block;
|
||
height: 1px;
|
||
width: 100%;
|
||
background: -webkit-linear-gradient(270deg, transparent, hsla(0, 0%, 100%, 0.2), transparent);
|
||
background: linear-gradient(270deg, transparent, hsla(0, 0%, 100%, 0.2), transparent);
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
}
|
||
.xjsdk-contextmenu-ul .line {
|
||
content: "";
|
||
display: block;
|
||
height: 1px;
|
||
width: 96%;
|
||
position: absolute;
|
||
left: 2%;
|
||
background: #ddd;
|
||
}
|
||
.xjsdk-contextmenu-ul > li > a {
|
||
padding: 6px 10px;
|
||
-webkit-transition: background-color 0.25s;
|
||
-o-transition: background-color 0.25s;
|
||
transition: background-color 0.25s;
|
||
display: block;
|
||
clear: both;
|
||
font-weight: 400;
|
||
line-height: 1.6;
|
||
color: #76838f;
|
||
white-space: nowrap;
|
||
color: #edffff;
|
||
text-decoration: none;
|
||
}
|
||
.xjsdk-contextmenu-ul > .active > a,
|
||
.xjsdk-contextmenu-ul > .active > a:focus,
|
||
.xjsdk-contextmenu-ul > .active > a:hover,
|
||
.xjsdk-contextmenu-ul > li > .active,
|
||
.xjsdk-contextmenu-ul > li > a:focus,
|
||
.xjsdk-contextmenu-ul > li > a:hover {
|
||
color: #fff;
|
||
background-color: #444d59;
|
||
text-decoration: none;
|
||
}
|
||
.xjsdk-contextmenu-ul line {
|
||
width: 100%;
|
||
height: 20px;
|
||
border: 1px;
|
||
}
|
||
.xjsdk-sub-menu {
|
||
min-width: 160px;
|
||
position: absolute;
|
||
top: 0;
|
||
left: 160px;
|
||
background: rgba(43, 44, 47, 0.8);
|
||
display: none;
|
||
}
|
||
.xjsdk-sub-menu li {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
font-size: 14px;
|
||
color: #fff;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
.xjsdk-sub-menu li:hover {
|
||
background-color: #444d59;
|
||
}
|
||
.xjsdk-animation-point,
|
||
.xjsdk-animation-point:after,
|
||
.xjsdk-animation-point:before,
|
||
.xjsdk-animation-point p,
|
||
.xjsdk-animation-point p:after,
|
||
.xjsdk-animation-point p:before {
|
||
margin: 0;
|
||
padding: 0;
|
||
-webkit-box-sizing: border-box;
|
||
-moz-box-sizing: border-box;
|
||
-o-box-sizing: border-box;
|
||
-ms-box-sizing: border-box;
|
||
box-sizing: border-box;
|
||
}
|
||
.xjsdk-animation-point {
|
||
width: 10px;
|
||
height: 10px;
|
||
border-radius: 50%;
|
||
border: 1px solid hsla(0, 0%, 100%, 0.5);
|
||
cursor: pointer;
|
||
color: #0ff;
|
||
background: currentColor;
|
||
z-index: 3;
|
||
left: 50%;
|
||
top: 50%;
|
||
-webkit-transform: translate(-50%, -50%);
|
||
-moz-transform: translate(-50%, -50%);
|
||
-o-transform: translate(-50%, -50%);
|
||
-ms-transform: translate(-50%, -50%);
|
||
transform: translate(-50%, -50%);
|
||
box-shadow:
|
||
0 0 2em currentColor,
|
||
0 0 0.5em currentColor;
|
||
position: absolute;
|
||
}
|
||
.xjsdk-animation-point.mapError {
|
||
color: red;
|
||
}
|
||
.xjsdk-animation-point.mapWarn {
|
||
color: #b5a603;
|
||
}
|
||
.xjsdk-animation-point.mapSuccess {
|
||
color: #239233;
|
||
}
|
||
.xjsdk-animation-point.mapOrange {
|
||
color: #8c4d34;
|
||
}
|
||
.xjsdk-animation-point:after,
|
||
.xjsdk-animation-point:before,
|
||
.xjsdk-animation-point p:after,
|
||
.xjsdk-animation-point p:before {
|
||
content: "";
|
||
position: absolute;
|
||
width: 100%;
|
||
height: 100%;
|
||
left: 50%;
|
||
top: 50%;
|
||
border-radius: 50%;
|
||
-webkit-transform: translate(-50%, -50%);
|
||
-moz-transform: translate(-50%, -50%);
|
||
-o-transform: translate(-50%, -50%);
|
||
-ms-transform: translate(-50%, -50%);
|
||
transform: translate(-50%, -50%);
|
||
}
|
||
.xjsdk-animation-point:after,
|
||
.xjsdk-animation-point:before {
|
||
border: 1px solid;
|
||
-webkit-animation: xjsdk-mapAni 1s ease infinite;
|
||
-moz-animation: xjsdk-mapAni 1s ease infinite;
|
||
-o-animation: xjsdk-mapAni 1s ease infinite;
|
||
-ms-animation: xjsdk-mapAni 1s ease infinite;
|
||
animation: xjsdk-mapAni 1s ease infinite;
|
||
}
|
||
.xjsdk-animation-point p:before {
|
||
border: 1px solid;
|
||
}
|
||
.xjsdk-animation-point p {
|
||
position: absolute;
|
||
left: 50%;
|
||
top: 50%;
|
||
width: 0;
|
||
height: 0;
|
||
border-radius: 50%;
|
||
-webkit-transform: translate(-50%, -50%);
|
||
-moz-transform: translate(-50%, -50%);
|
||
-o-transform: translate(-50%, -50%);
|
||
-ms-transform: translate(-50%, -50%);
|
||
transform: translate(-50%, -50%);
|
||
-webkit-animation: xjsdk-mapAni 2s ease infinite;
|
||
-moz-animation: xjsdk-mapAni 2s ease infinite;
|
||
-o-animation: xjsdk-mapAni 2s ease infinite;
|
||
-ms-animation: xjsdk-mapAni 2s ease infinite;
|
||
animation: xjsdk-mapAni 2s ease infinite;
|
||
}
|
||
@-webkit-keyframes xjsdk-mapAni {
|
||
0% {
|
||
width: 0;
|
||
height: 0;
|
||
opacity: 1;
|
||
filter: alpha(opacity=1);
|
||
}
|
||
25% {
|
||
width: 12px;
|
||
height: 12px;
|
||
opacity: 0.7;
|
||
filter: alpha(opacity=70);
|
||
}
|
||
50% {
|
||
width: 20px;
|
||
height: 20px;
|
||
opacity: 0.5;
|
||
filter: alpha(opacity=50);
|
||
}
|
||
75% {
|
||
width: 30px;
|
||
height: 30px;
|
||
opacity: 0.2;
|
||
filter: alpha(opacity=20);
|
||
}
|
||
to {
|
||
width: 40px;
|
||
height: 40px;
|
||
opacity: 0;
|
||
filter: alpha(opacity=0);
|
||
}
|
||
}
|
||
@-moz-keyframes xjsdk-mapAni {
|
||
0% {
|
||
width: 0;
|
||
height: 0;
|
||
opacity: 1;
|
||
filter: alpha(opacity=1);
|
||
}
|
||
25% {
|
||
width: 12px;
|
||
height: 12px;
|
||
opacity: 0.7;
|
||
filter: alpha(opacity=70);
|
||
}
|
||
50% {
|
||
width: 20px;
|
||
height: 20px;
|
||
opacity: 0.5;
|
||
filter: alpha(opacity=50);
|
||
}
|
||
75% {
|
||
width: 30px;
|
||
height: 30px;
|
||
opacity: 0.2;
|
||
filter: alpha(opacity=20);
|
||
}
|
||
to {
|
||
width: 40px;
|
||
height: 40px;
|
||
opacity: 0;
|
||
filter: alpha(opacity=0);
|
||
}
|
||
}
|
||
@-o-keyframes xjsdk-mapAni {
|
||
0% {
|
||
width: 0;
|
||
height: 0;
|
||
opacity: 1;
|
||
filter: alpha(opacity=1);
|
||
}
|
||
25% {
|
||
width: 12px;
|
||
height: 12px;
|
||
opacity: 0.7;
|
||
filter: alpha(opacity=70);
|
||
}
|
||
50% {
|
||
width: 20px;
|
||
height: 20px;
|
||
opacity: 0.5;
|
||
filter: alpha(opacity=50);
|
||
}
|
||
75% {
|
||
width: 30px;
|
||
height: 30px;
|
||
opacity: 0.2;
|
||
filter: alpha(opacity=20);
|
||
}
|
||
to {
|
||
width: 40px;
|
||
height: 40px;
|
||
opacity: 0;
|
||
filter: alpha(opacity=0);
|
||
}
|
||
}
|
||
@-ms-keyframes xjsdk-mapAni {
|
||
0% {
|
||
width: 0;
|
||
height: 0;
|
||
opacity: 1;
|
||
filter: alpha(opacity=1);
|
||
}
|
||
25% {
|
||
width: 12px;
|
||
height: 12px;
|
||
opacity: 0.7;
|
||
filter: alpha(opacity=70);
|
||
}
|
||
50% {
|
||
width: 20px;
|
||
height: 20px;
|
||
opacity: 0.5;
|
||
filter: alpha(opacity=50);
|
||
}
|
||
75% {
|
||
width: 30px;
|
||
height: 30px;
|
||
opacity: 0.2;
|
||
filter: alpha(opacity=20);
|
||
}
|
||
to {
|
||
width: 40px;
|
||
height: 40px;
|
||
opacity: 0;
|
||
filter: alpha(opacity=0);
|
||
}
|
||
}
|
||
@keyframes xjsdk-mapAni {
|
||
0% {
|
||
width: 0;
|
||
height: 0;
|
||
opacity: 1;
|
||
filter: alpha(opacity=1);
|
||
}
|
||
25% {
|
||
width: 12px;
|
||
height: 12px;
|
||
opacity: 0.7;
|
||
filter: alpha(opacity=70);
|
||
}
|
||
50% {
|
||
width: 20px;
|
||
height: 20px;
|
||
opacity: 0.5;
|
||
filter: alpha(opacity=50);
|
||
}
|
||
75% {
|
||
width: 30px;
|
||
height: 30px;
|
||
opacity: 0.2;
|
||
filter: alpha(opacity=20);
|
||
}
|
||
to {
|
||
width: 40px;
|
||
height: 40px;
|
||
opacity: 0;
|
||
filter: alpha(opacity=0);
|
||
}
|
||
}
|
||
.xjsdk-widgetbar {
|
||
margin: 0 auto;
|
||
position: absolute;
|
||
bottom: 30px;
|
||
left: 20%;
|
||
width: 60%;
|
||
height: auto;
|
||
z-index: 1987;
|
||
}
|
||
.xjsdk-widgetbar .fa {
|
||
margin-right: 5px;
|
||
}
|