css - 使用 Bonsai JS 样式化 SVG 元素

Question

刚开始使用 Bonsai JS，在文档中找不到任何内容，所以我想我在这里问。如何设置元素类属性，以便在 CSS 中定义一些样式？Bonsai 直接支持大多数样式，但我还需要在将鼠标悬停在元素上时更改光标类型。

Answer 1

BonsaiJS 不允许您设置“类”属性。相反，当光标悬停在DisplayObject.

new Rect(150, 150, 150, 150).attr({
  fillColor: "red"
}).addTo(stage).on("mouseover mouseout", function(e) {
  this.attr({
    cursor: e.type == "mouseover" ? "pointer" : "inherit"
  });
});

在 Orbit 中打开： http://orbit.bonsaijs.org/#new%20Rect(150%2C%20150%2C%20150%2C%20150).attr( %7B%0A%20%20fillColor%3A%20%22red %22%0A%7D).addTo(stage).on(%22mouseover%20mouseout%22%2C%20function(e)%20%7B%0A%20%20this.attr(%7B%0A%20%20% 20%20cursor%3A%20e.type%20%3D%3D%20%22mouseover%22%20%3F%20%22pointer%22%20%3A%20%22inherit%22%0A%20%20%7D) %3B%0A%7D)%3B%0A%20