使用P5创建交互式地图

Question

我正在尝试绘制美国各州的地图，并在地图上标出点。当您将鼠标悬停在该点上时，它将告诉您国家的标题以及您将要了解的内容的简要提要。单击鼠标，将打开指定的HTML页面。我想为此项目使用P5。任何帮助，将不胜感激

Answer 1

function setup() {
  createCanvas(windowWidth, windowHeight); //You choose the width and height.
}
function draw() {
  if (mouseX < 100 && mouseY < 100) { // IF statement would need changing
    rect(x, y, w, h); // undefined variables to be replaced with numbers.
  }
}

draw运行非常频繁，并且mouseX和mouseY内置变量组成了鼠标的坐标。利用这个优势。

在此示例中，如果鼠标位于从0到100,100的正方形内，则rect将在那里。地图会更困难，因为if语句可能会拥挤。
顺便说一句，您<使用rect，主要要点是，如果用户将鼠标悬停在特定区域上，if将运行。