使用本地图标

This commit is contained in:
licuizhu 2024-04-08 21:56:05 +08:00
parent 8fdc2b6818
commit 4c876e5ac3
6 changed files with 125 additions and 105 deletions

View File

@ -151,7 +151,7 @@ body {
width: 220px; width: 220px;
z-index: 999; z-index: 999;
margin: 2% 4.2%; margin: 2% 4.2%;
background: rgba(239,240,248,0.7); background: rgba(239,240,248,1);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
border-radius: 10px; border-radius: 10px;
opacity: 1; opacity: 1;
@ -227,6 +227,14 @@ body {
#redio-btn-group { #redio-btn-group {
width: 100%; width: 100%;
} }
#redio-btn-group span {
display: inline-block;
width: 100%;
height: 100%;
position: relative;
left: -2px;
top: 6px;
}
#redio-btn-group .radio-btn:hover { #redio-btn-group .radio-btn:hover {
// background-size: 90%; // background-size: 90%;
// border: 1px solid #2F66F2; // border: 1px solid #2F66F2;
@ -235,335 +243,335 @@ body {
background: none; background: none;
border: none; border: none;
} }
#redio-btn-group .iconPoint01-black { #redio-btn-group .iconPoint01_black {
background: url(./assets/icon/layerIcon/iconPoint01_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint01-blue { #redio-btn-group .iconPoint01_blue {
background: url(./assets/icon/layerIcon/iconPoint01_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint01-cyan { #redio-btn-group .iconPoint01_cyan {
background: url(./assets/icon/layerIcon/iconPoint01_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint01-gray { #redio-btn-group .iconPoint01_gray {
background: url(./assets/icon/layerIcon/iconPoint01_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint01-green { #redio-btn-group .iconPoint01_green {
background: url(./assets/icon/layerIcon/iconPoint01_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint01-pink { #redio-btn-group .iconPoint01_pink {
background: url(./assets/icon/layerIcon/iconPoint01_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint01-red { #redio-btn-group .iconPoint01_red {
background: url(./assets/icon/layerIcon/iconPoint01_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint01-white { #redio-btn-group .iconPoint01_white {
background: url(./assets/icon/layerIcon/iconPoint01_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint01-yellow { #redio-btn-group .iconPoint01_yellow {
background: url(./assets/icon/layerIcon/iconPoint01_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint01_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-black { #redio-btn-group .iconPoint02_black {
background: url(./assets/icon/layerIcon/iconPoint02_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-blue { #redio-btn-group .iconPoint02_blue {
background: url(./assets/icon/layerIcon/iconPoint02_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-cyan { #redio-btn-group .iconPoint02_cyan {
background: url(./assets/icon/layerIcon/iconPoint02_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-gray { #redio-btn-group .iconPoint02_gray {
background: url(./assets/icon/layerIcon/iconPoint02_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-green { #redio-btn-group .iconPoint02_green {
background: url(./assets/icon/layerIcon/iconPoint02_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-pink { #redio-btn-group .iconPoint02_pink {
background: url(./assets/icon/layerIcon/iconPoint02_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-red { #redio-btn-group .iconPoint02_red {
background: url(./assets/icon/layerIcon/iconPoint02_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-white { #redio-btn-group .iconPoint02_white {
background: url(./assets/icon/layerIcon/iconPoint02_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint02-yellow { #redio-btn-group .iconPoint02_yellow {
background: url(./assets/icon/layerIcon/iconPoint02_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint02_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-black { #redio-btn-group .iconPoint03_black {
background: url(./assets/icon/layerIcon/iconPoint03_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-blue { #redio-btn-group .iconPoint03_blue {
background: url(./assets/icon/layerIcon/iconPoint03_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-cyan { #redio-btn-group .iconPoint03_cyan {
background: url(./assets/icon/layerIcon/iconPoint03_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-gray { #redio-btn-group .iconPoint03_gray {
background: url(./assets/icon/layerIcon/iconPoint03_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-green { #redio-btn-group .iconPoint03_green {
background: url(./assets/icon/layerIcon/iconPoint03_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-pink { #redio-btn-group .iconPoint03_pink {
background: url(./assets/icon/layerIcon/iconPoint03_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-red { #redio-btn-group .iconPoint03_red {
background: url(./assets/icon/layerIcon/iconPoint03_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-white { #redio-btn-group .iconPoint03_white {
background: url(./assets/icon/layerIcon/iconPoint03_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint03-yellow { #redio-btn-group .iconPoint03_yellow {
background: url(./assets/icon/layerIcon/iconPoint03_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint03_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-black { #redio-btn-group .iconPoint04_black {
background: url(./assets/icon/layerIcon/iconPoint04_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-blue { #redio-btn-group .iconPoint04_blue {
background: url(./assets/icon/layerIcon/iconPoint04_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-cyan { #redio-btn-group .iconPoint04_cyan {
background: url(./assets/icon/layerIcon/iconPoint04_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-gray { #redio-btn-group .iconPoint04_gray {
background: url(./assets/icon/layerIcon/iconPoint04_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-green { #redio-btn-group .iconPoint04_green {
background: url(./assets/icon/layerIcon/iconPoint04_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-pink { #redio-btn-group .iconPoint04_pink {
background: url(./assets/icon/layerIcon/iconPoint04_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-red { #redio-btn-group .iconPoint04_red {
background: url(./assets/icon/layerIcon/iconPoint04_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-white { #redio-btn-group .iconPoint04_white {
background: url(./assets/icon/layerIcon/iconPoint04_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint04-yellow { #redio-btn-group .iconPoint04_yellow {
background: url(./assets/icon/layerIcon/iconPoint04_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint04_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-black { #redio-btn-group .iconPoint05_black {
background: url(./assets/icon/layerIcon/iconPoint05_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-blue { #redio-btn-group .iconPoint05_blue {
background: url(./assets/icon/layerIcon/iconPoint05_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-cyan { #redio-btn-group .iconPoint05_cyan {
background: url(./assets/icon/layerIcon/iconPoint05_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-gray { #redio-btn-group .iconPoint05_gray {
background: url(./assets/icon/layerIcon/iconPoint05_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-green { #redio-btn-group .iconPoint05_green {
background: url(./assets/icon/layerIcon/iconPoint05_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-pink { #redio-btn-group .iconPoint05_pink {
background: url(./assets/icon/layerIcon/iconPoint05_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-red { #redio-btn-group .iconPoint05_red {
background: url(./assets/icon/layerIcon/iconPoint05_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-white { #redio-btn-group .iconPoint05_white {
background: url(./assets/icon/layerIcon/iconPoint05_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint05-yellow { #redio-btn-group .iconPoint05_yellow {
background: url(./assets/icon/layerIcon/iconPoint05_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint05_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-black { #redio-btn-group .iconPoint06_black {
background: url(./assets/icon/layerIcon/iconPoint06_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-blue { #redio-btn-group .iconPoint06_blue {
background: url(./assets/icon/layerIcon/iconPoint06_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-cyan { #redio-btn-group .iconPoint06_cyan {
background: url(./assets/icon/layerIcon/iconPoint06_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-gray { #redio-btn-group .iconPoint06_gray {
background: url(./assets/icon/layerIcon/iconPoint06_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-green { #redio-btn-group .iconPoint06_green {
background: url(./assets/icon/layerIcon/iconPoint06_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-pink { #redio-btn-group .iconPoint06_pink {
background: url(./assets/icon/layerIcon/iconPoint06_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-red { #redio-btn-group .iconPoint06_red {
background: url(./assets/icon/layerIcon/iconPoint06_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-white { #redio-btn-group .iconPoint06_white {
background: url(./assets/icon/layerIcon/iconPoint06_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint06-yellow { #redio-btn-group .iconPoint06_yellow {
background: url(./assets/icon/layerIcon/iconPoint06_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint06_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-black { #redio-btn-group .iconPoint07_black {
background: url(./assets/icon/layerIcon/iconPoint07_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-blue { #redio-btn-group .iconPoint07_blue {
background: url(./assets/icon/layerIcon/iconPoint07_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-cyan { #redio-btn-group .iconPoint07_cyan {
background: url(./assets/icon/layerIcon/iconPoint07_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-gray { #redio-btn-group .iconPoint07_gray {
background: url(./assets/icon/layerIcon/iconPoint07_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-green { #redio-btn-group .iconPoint07_green {
background: url(./assets/icon/layerIcon/iconPoint07_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-pink { #redio-btn-group .iconPoint07_pink {
background: url(./assets/icon/layerIcon/iconPoint07_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-red { #redio-btn-group .iconPoint07_red {
background: url(./assets/icon/layerIcon/iconPoint07_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-white { #redio-btn-group .iconPoint07_white {
background: url(./assets/icon/layerIcon/iconPoint07_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint07-yellow { #redio-btn-group .iconPoint07_yellow {
background: url(./assets/icon/layerIcon/iconPoint07_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint07_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-black { #redio-btn-group .iconPoint08_black {
background: url(./assets/icon/layerIcon/iconPoint08_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-blue { #redio-btn-group .iconPoint08_blue {
background: url(./assets/icon/layerIcon/iconPoint08_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-cyan { #redio-btn-group .iconPoint08_cyan {
background: url(./assets/icon/layerIcon/iconPoint08_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-gray { #redio-btn-group .iconPoint08_gray {
background: url(./assets/icon/layerIcon/iconPoint08_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-green { #redio-btn-group .iconPoint08_green {
background: url(./assets/icon/layerIcon/iconPoint08_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-pink { #redio-btn-group .iconPoint08_pink {
background: url(./assets/icon/layerIcon/iconPoint08_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-red { #redio-btn-group .iconPoint08_red {
background: url(./assets/icon/layerIcon/iconPoint08_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-white { #redio-btn-group .iconPoint08_white {
background: url(./assets/icon/layerIcon/iconPoint08_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint08-yellow { #redio-btn-group .iconPoint08_yellow {
background: url(./assets/icon/layerIcon/iconPoint08_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint08_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-black { #redio-btn-group .iconPoint09_black {
background: url(./assets/icon/layerIcon/iconPoint09_black.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_black.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-blue { #redio-btn-group .iconPoint09_blue {
background: url(./assets/icon/layerIcon/iconPoint09_blue.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_blue.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-cyan { #redio-btn-group .iconPoint09_cyan {
background: url(./assets/icon/layerIcon/iconPoint09_cyan.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_cyan.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-gray { #redio-btn-group .iconPoint09_gray {
background: url(./assets/icon/layerIcon/iconPoint09_gray.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_gray.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-green { #redio-btn-group .iconPoint09_green {
background: url(./assets/icon/layerIcon/iconPoint09_green.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_green.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-pink { #redio-btn-group .iconPoint09_pink {
background: url(./assets/icon/layerIcon/iconPoint09_pink.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_pink.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-red { #redio-btn-group .iconPoint09_red {
background: url(./assets/icon/layerIcon/iconPoint09_red.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_red.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-white { #redio-btn-group .iconPoint09_white {
background: url(./assets/icon/layerIcon/iconPoint09_white.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_white.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }
#redio-btn-group .iconPoint09-yellow { #redio-btn-group .iconPoint09_yellow {
background: url(./assets/icon/layerIcon/iconPoint09_yellow.svg) no-repeat center center; background: url(./assets/icon/layerIcon/iconPoint09_yellow.svg) no-repeat center center;
background-size: 80%; background-size: 80%;
} }

View File

@ -1,9 +1,19 @@
function SetLogoImagePath (e) { function SetLogoImagePath (e) {
return ( let fileName = e.logoImagePath;
<span> if (fileName.substr(0, 7) == "http://" || fileName.substr(0, 6) == "https:" || fileName.substr(0, 7) == "http:\\\\") {
<img src={e.logoImagePath} /> return (
</span> <span>
); <img src={fileName} />
</span>
);
} else {
return (
<span id="redio-btn-group">
<span className={fileName}></span>
</span>
);
}
} }
export default SetLogoImagePath; export default SetLogoImagePath;

View File

@ -170,7 +170,6 @@ class LayerData extends React.Component {
}) })
}; };
onLayerIconColorChange = (e) => { onLayerIconColorChange = (e) => {
debugger
this.setState({ this.setState({
addLayer: { addLayer: {
id: this.state.addLayer.id, id: this.state.addLayer.id,
@ -237,15 +236,15 @@ class LayerData extends React.Component {
<Radio.Button name='logoColor' value='black' className='radio-btn-color color-09'></Radio.Button> <Radio.Button name='logoColor' value='black' className='radio-btn-color color-09'></Radio.Button>
</Radio.Group> </Radio.Group>
<Radio.Group id='redio-btn-group' onChange={this.onLayerIogoImagePathChange}> <Radio.Group id='redio-btn-group' onChange={this.onLayerIogoImagePathChange}>
<Radio.Button name='logoImagePath' value={`iconPoint01_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint01-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint01_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint01_${this.state.addLayer.logoImageColor}`}></Radio.Button>
<Radio.Button name='logoImagePath' value={`iconPoint02_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint02-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint02_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint02_${this.state.addLayer.logoImageColor}`}></Radio.Button>
<Radio.Button name='logoImagePath' value={`iconPoint03_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint03-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint03_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint03_${this.state.addLayer.logoImageColor}`}></Radio.Button>
<Radio.Button name='logoImagePath' value={`iconPoint04_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint04-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint04_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint04_${this.state.addLayer.logoImageColor}`}></Radio.Button>
<Radio.Button name='logoImagePath' value={`iconPoint05_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint05-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint05_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint05_${this.state.addLayer.logoImageColor}`}></Radio.Button>
<Radio.Button name='logoImagePath' value={`iconPoint06_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint06-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint06_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint06_${this.state.addLayer.logoImageColor}`}></Radio.Button>
<Radio.Button name='logoImagePath' value={`iconPoint07_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint07-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint07_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint07_${this.state.addLayer.logoImageColor}`}></Radio.Button>
<Radio.Button name='logoImagePath' value={`iconPoint08_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint08-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint08_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint08_${this.state.addLayer.logoImageColor}`}></Radio.Button>
<Radio.Button name='logoImagePath' value={`iconPoint09_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint09-${this.state.addLayer.logoImageColor}`}></Radio.Button> <Radio.Button name='logoImagePath' value={`iconPoint09_${this.state.addLayer.logoImageColor}`} className={`radio-btn iconPoint09_${this.state.addLayer.logoImageColor}`}></Radio.Button>
</Radio.Group> </Radio.Group>
</Form.Item> </Form.Item>
<Form.Item label="图层备注"> <Form.Item label="图层备注">

View File

@ -157,15 +157,18 @@ class BaseMap extends React.Component{
let map = this.state.map; let map = this.state.map;
let LabelsData = data || []; let LabelsData = data || [];
let markerLayer = new MarkerLayer({name: layerId}); let markerLayer = new MarkerLayer({name: layerId});
let el, popup, marker, icon;debugger let el, popup, marker, icon;
for (let i = 0; i < LabelsData.length; i++) { for (let i = 0; i < LabelsData.length; i++) {
// icon = LabelsData[0].logoImage;
icon = icon04;
el = document.createElement('label'); el = document.createElement('label');
el.style.width = '26px'; el.style.width = '26px';
el.style.height = '26px'; el.style.height = '26px';
el.style.background = 'url("' + icon + '") no-repeat'; icon = LabelsData[0].logoImage;
el.style.backgroundSize = 'cover'; if (icon && (icon.substr(0, 7) == "http://" || icon.substr(0, 6) == "https:" || icon.substr(0, 7) == "http:\\\\")) {
el.style.background = 'url("' + icon + '") no-repeat';
el.style.backgroundSize = 'cover';
} else {
el.className = icon;
}
marker = new Marker({ marker = new Marker({
element: el element: el
@ -756,7 +759,7 @@ class BaseMap extends React.Component{
<Button disabled className={styles.btnRight}>点位导入</Button> <Button disabled className={styles.btnRight}>点位导入</Button>
</div> </div>
{/* 地图 */} {/* 地图 */}
<div className={styles.mapWrap}> <div className={styles.mapWrap} id='redio-btn-group'>
<div style={{width: '100%', height: '100vh'}} id="container" /> <div style={{width: '100%', height: '100vh'}} id="container" />
</div> </div>
</div> </div>

View File

@ -1,5 +1,5 @@
.selectWrap { .selectWrap {
background: rgba(239,240,248,0.7); background: rgba(239,240,248,1);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
border-radius: 10px 10px 10px 10px; border-radius: 10px 10px 10px 10px;
opacity: 1; opacity: 1;

View File

@ -16,7 +16,7 @@ function Register(e) {
setMobile(val) setMobile(val)
} }
// 点击获取验证码 // 点击获取验证码
let getCheckCode = (values) => {debugger let getCheckCode = (values) => {
// e.preventDefault(); // e.preventDefault();
// 请求发送验证码接口,请求成功开始倒计时 // 请求发送验证码接口,请求成功开始倒计时
registerSms({'phone': mobile}).then((e) => { registerSms({'phone': mobile}).then((e) => {