用帝国做的网站,wordpress获取路径,请谁做网站比较放心,哔哩哔哩网页版和客户端哪个好前言覆盖物的最高级就是自定义覆盖物#xff0c;而往往业务中就必须用自定义覆盖物#xff0c;因为都用上了地图这么吊的组件了#xff0c;覆盖物也必须华丽、高度定制。官网Github自定义覆盖物手册效果效果核心其实是三角箭头的阴影#xff0c;其他都很好说。说起三角的阴…前言覆盖物的最高级就是自定义覆盖物而往往业务中就必须用自定义覆盖物因为都用上了地图这么吊的组件了覆盖物也必须华丽、高度定制。官网Github自定义覆盖物手册效果效果核心其实是三角箭头的阴影其他都很好说。说起三角的阴影其实就是看你对box-shadow是否精通原则上是上方的2条边不能出现shadow下方的shadow要贴近大容器的shadow混为一体。方案一有宽高容器背景染色加旋转加shadow有宽高容器背景染色加旋转加shadow方案二无宽高容器利用border染色加旋转加shadow无宽高容器利用border染色加旋转加shadow这两个方案都差不多主要考察你是不是对shadow调试的更好。方案一有宽高容器背景染色解释一下left: 113.7px;它的计算方法是250 / 2 125 算出中心点√(16 * 16 * 2)是斜边的长度大约等于22.6一半等于11.3125 - 11.3 113.7就是left: 113.7px;.bm-overlay {width: 250px;height: 80px;line-height: 1.6;background-color: #fff;box-shadow: 0 0 5px #ccc;border-radius: 8px;padding: 10px;position: relative;font-size: 0;::after {position: absolute;content: ;transform: rotate(45deg);width: 16px;height: 16px;font-size: 0;position: absolute;background-color: #fff;box-shadow: 5px 5px 5px -5px #ccc;bottom: -8px;left: 113.7px;}.logo {width: 60px;height: 60px;margin: 0 10px 0 0;vertical-align: top;}.inline-block {width: 160px;vertical-align: top;}.title {color: #333;font-size: 14px;font-weight: bold;}.contents {color: 666;font-size: 12px;}}方案二无宽高容器利用border染色.bm-overlay {width: 250px;height: 80px;line-height: 1.6;background-color: #fff;box-shadow: 0 0 5px #ccc;border-radius: 8px;padding: 10px;position: relative;font-size: 0;::before {position: absolute;content: ;width: 0;height: 0;font-size: 0;position: absolute;transform: rotate(45deg);border-width: 8px;border-style: solid dashed dashed;border-color: transparent #fff #fff transparent;box-shadow: 1px 1px 1px #ccc;bottom: -8px;left: 113.7px;}.logo {width: 60px;height: 60px;margin: 0 10px 0 0;vertical-align: top;}.inline-block {width: 160px;vertical-align: top;}.title {color: #333;font-size: 14px;font-weight: bold;}.contents {color: 666;font-size: 12px;}}el.style.left 的偏移量draw({ el, BMap, map }) {const pixel map.pointToOverlayPixel(new BMap.Point(114.628239, 38.041396))el.style.left pixel.x pxel.style.top pixel.y px},这里el.style.left和el.style.top要设偏移默认是左上角。先说x轴应偏移半个大容器宽度125。el.style.left pixel.x - 125 px再说y轴应偏移整个大容器高度加上三角容器斜边一半上面有计算过是11.3所以是91.3。el.style.top pixel.y - 91.3 px
