如何避免展开地图中标记的标题重叠？

Question

我正在使用展开地图创建标记。当用户将鼠标悬停在标记上时，会显示标题。但其他标记与标题重叠，因此它隐藏了标题中显示的信息。为了防止这种情况，我使用 PGraphics 将标题绘制为：

    public void showTitle(PGraphics pg, float x, float y)
{
    String name = getCity() + " " + getCountry() + " ";
    String pop = "Pop: " + getPopulation() + " Million";
    /
    /buffer is defined already.
    buffer.beginDraw();
    buffer.fill(255, 255, 255);
    buffer.textSize(12);
    buffer.rectMode(PConstants.CORNER);
    buffer.rect(x, y-TRI_SIZE-39, Math.max(pg.textWidth(name), pg.textWidth(pop)) + 6, 39);
    buffer.fill(0, 0, 0);
    buffer.textAlign(PConstants.LEFT, PConstants.TOP);
    buffer.text(name, x+3, y-TRI_SIZE-33);
    buffer.text(pop, x+3, y - TRI_SIZE -18);
    buffer.endDraw();


}

然后通过方法在屏幕上绘制缓冲区

public void draw() {
      map.draw();
      image(buffer, 0,0);
      }

它解决了这个问题，现在标题没有与标记重叠，但它没有在标记的正下方绘制，而是在屏幕上随机绘制，如图所示 我该如何避免呢？请帮忙。

Answer 1

您需要在绘制之前存储缓冲区的位置。基本上，你需要改变这一行：

image(buffer, 0,0);

这样的：

image(buffer, bufferX, bufferY);

您必须根据您希望缓冲区显示的位置计算bufferX 和bufferY。一个非常愚蠢的实现可能是这样的：

public void showTitle(PGraphics pg, float x, float y)
{
   bufferX = x;
   bufferY = y;
   //rest of your code

我对展开地图不够熟悉，无法准确告诉您该怎么做，但这些是基础知识。请注意，Unfolding Maps 可能会进行自己的翻译，因此您可能必须使用 pushMatrix() 和 popMatrix() 函数。另请注意，您可能需要从地图空间投影到屏幕空间。 Unfolding Maps library 可能有关于如何做到这一点的文档。

Answer 2

在设置中，您创建了一个具有一定大小和偏移量的地图。缓冲区应该以相同的大小创建。

但最重要的是绘制具有相同偏移量的缓冲区。

你的标题只是用负偏移量绘制的，不是随机的。

private PGraphics buffer;

public void setup() {
    size(900, 700);
    //Create map with offset
    map = new UnfoldingMap(this, 200, 50, 650 ,600, new Google.GoogleMapProvider());
    //Create buffer, same size as map
    buffer = createGraphics(650, 600);
    //rest of the code..
}

public void draw() {
    background(0);
    map.draw();
    //put buffer over the map, with same offset
    image(buffer, 200, 50);
}

Answer 3

我参加了相同的 Coursera 课程（Java 中的面向对象编程）并致力于修复此功能。这是我解决此问题的方法。

我意识到标题被覆盖了，因为标记是在 EarthquakeCityMap 类的 draw() 部分的 map.draw() 方法中反复绘制的。所以解决方法是将 showTitle 实现从标记类移动到 EarthquakeCityMap 类，并让标题绘制在标记的屏幕位置而不是纬度和经度。

UnfoldingMaps 库中的 SimplePointMarker 类有一个从 AbstractMarker 类继承的方法 getScreenPosition()。有关更多详细信息，请参阅 JavaDoc。因为 CommonMarker 类是 SimplePointMarker 类的子类，而 EarthquakeMarker 类是 CommonMarker 的子类，所以 EarthquakeMarker 类也默认提供 getScreenPosition() 方法。

以下是在 EarthquakeCityMap.java 文件中显示地震标题的方法。请注意，您可以在此处自动使用 Processing 的图形方法，因为 EarthquakeCityMap 类扩展了 PApplet。

    /** Show the title of the earthquake if this marker is selected */
    private void showEqTitle(EarthquakeMarker m, UnfoldingMap map)
    {   
        float x = m.getScreenPosition(map).x;
        float y = m.getScreenPosition(map).y;

        String title = m.getTitle();

        pushStyle();
        
        rectMode(PConstants.CORNER);
        stroke(110);
        fill(255,255,255);
        rect(x, y + 15, textWidth(title) + 6, 18, 5);
        textAlign(PConstants.LEFT, PConstants.TOP);
        fill(0);
        text(title, x + 3 , y +18);

        popStyle();
    }

这是我在 draw() 函数中实现上述方法的方法。

    public void draw() {
        background(0);
        map.draw();
        addKey();
        
        for (Marker m: quakeMarkers) {
            EarthquakeMarker eq = (EarthquakeMarker) m;
            if (m.isSelected()) {
                showEqTitle(eq, map);
            }
        }
    }

最后，这是显示标题不再被标记覆盖的结果图像。万岁~ The earthquake map display when the mouse hovers one of the earthquake marker