Question

//我的问题描述在这里

我在processing.js

中使用此代码

void setup(){

size(window.innerWidth,window.innerHeight);
} 

void draw()
{
   fill(0,0,0);
   text("About",760,312);
}

我的问题是我想要关于是一个href链接。当我点击关于时会显示一些页面。所以我想知道如何制作?????

感谢你......等待你的回复。

Answer 1

您可以在PJS中创建链接，PJS参考中也有一些示例。特别是，this page上有一些代码，带有'alink'类，用于处理鼠标悬停和点击。或者，您可以在mousePressed()的调用中使用link method来处理用户在单击画布时将其发送到某个位置。

编辑问：另外，问一下，为什么不把PJS之外的链接放在首位呢？如果您将它们添加为普通HTML，您的生活将变得更加轻松。

Answer 2

您必须自己制作链接产生区域，因为草图不是网页。一些代码可以帮助您入门：

ArrayList links = new ArrayList();

void setup()
{
  size(window.innerWidth,window.innerHeight);
  links.add(new Link("About...",30,height/2,
                     "Arial",16,"www.stackoverflow.com");
} 

void draw()
{
  fill(0,0,0);
  text("About",760,312);
} 

class Link
{
  String ltext,fontname,url = "";
  int x,y,tsize=0;
  float tw=0;
  Link(String t, int _x, int _y, String fn, int ts, String _url) {
    ltext=t; x=_x; y=_y;
    fontname = fn; tw=textWidth(ltext); tsize=ts;
    url=_url; }
  draw() { textFont(createFont(fontname,tsize)); fill(0); text(ltext, x, y); }
  void mouseOver(int xy, int yo) { return x<xo && y-ts<yo && xo<x+tw && yo<y; }
}

void mousePressed()
{
  for(Object o: links)
  {
    Link l = (Link) o;
    if(l.mouseOver(mouseX,mouseY))
    {
      // This is a plain javascript instruction - to do this
      // properly, use a js interface instead,  as described in
      // http://processingjs.org/reference/articles/PomaxGuide#sketchtojs
      location = l.url;
    }
  }
}

在processing.js中的画布上创建一个href链接

2 个答案: