|
@@ -357,27 +357,26 @@ export default {
|
|
|
},
|
|
|
initEvent() {
|
|
|
let lastHoveredFeature = null;
|
|
|
-
|
|
|
- function calculateHoverTop(mouseY, hoverHeight) {
|
|
|
- const windowHeight = window.innerHeight;
|
|
|
+ const calculateHoverTop = (mouseY, hoverHeight) => {
|
|
|
+ const componentHeight = this.$el.clientHeight;
|
|
|
const offset = 10;
|
|
|
- if (mouseY + hoverHeight + offset > windowHeight) {
|
|
|
+ if (mouseY + hoverHeight + offset > componentHeight) {
|
|
|
return mouseY - hoverHeight - offset;
|
|
|
}
|
|
|
return mouseY - hoverHeight / 2;
|
|
|
- }
|
|
|
+ };
|
|
|
|
|
|
- function calculateHoverLeft(mouseX, hoverWidth) {
|
|
|
- const windowWidth = window.innerWidth;
|
|
|
+ const calculateHoverLeft = (mouseX, hoverWidth) => {
|
|
|
+ const componentWidth = this.$el.clientWidth;
|
|
|
const offset = 10;
|
|
|
- if (mouseX + hoverWidth + offset > windowWidth) {
|
|
|
+ if (mouseX + hoverWidth + offset > componentWidth) {
|
|
|
return mouseX - hoverWidth - offset;
|
|
|
}
|
|
|
if (mouseX - hoverWidth - offset < 0) {
|
|
|
return offset;
|
|
|
}
|
|
|
return mouseX + offset;
|
|
|
- }
|
|
|
+ };
|
|
|
this.map.on("pointermove", (evt) => {
|
|
|
const features = this.map.getFeaturesAtPixel(evt.pixel, {
|
|
|
hitTolerance: 1,
|
|
@@ -538,13 +537,13 @@ export default {
|
|
|
padding: 0;
|
|
|
z-index: 100;
|
|
|
h3 {
|
|
|
- background-color:var(--header-bg);
|
|
|
+ background-color: var(--header-bg);
|
|
|
width: 240px;
|
|
|
padding: 5px 10px;
|
|
|
font-size: 16px;
|
|
|
}
|
|
|
div {
|
|
|
- background-color:var(--content-bg);
|
|
|
+ background-color: var(--content-bg);
|
|
|
width: 240px;
|
|
|
font-size: 12px;
|
|
|
p {
|
|
@@ -577,5 +576,4 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
</style>
|