画布工具提示出现在画布外？

Question

我使用KineticJS和D3.js进行了以下操作。当用户将鼠标悬停在其中一个点上时，我使用KineticJS让我弹出工具提示。但是，由于画布的边界，工具提示似乎被截断。有没有一种方法可以让它出现而不会被剪裁？

整个代码本身非常庞大，包含很多不相关的内容，所以我发布了相关的代码片段：

    this.stage = new Kinetic.Stage({
        container: 'canvas',
        width: this.WIDTH,
        height: this.HEIGHT
    });

    this.circlesLayer = new Kinetic.Layer();
    this.tooltipLayer = new Kinetic.Layer();

    this.stage.reset();
    this.stage.clear();

    // Some d3 specific code
    this.xRange.domain([
        d3.min(this.data, function(d) {
        return d.x;
    }), d3.max(this.data, function(d) {
        return d.x;
    })]);

    this.yRange.domain([
        d3.min(this.data, function(d) {
        return d.y;
    }), d3.max(this.data, function(d) {
        return d.y;
    })]);

    var axes_transition = d3.select("#" + this.div).transition().duration(1000).ease("exp-in-out")

    // transition the axes
    axes_transition.select(".x.axis").call(this.xAxis);

    // Drawing the circles
    this.last = this.data.map(this.position);
    this.last.forEach(this.kineticCircle);

    // Setting up the tooltip
    this.tooltip = new Kinetic.Text({
      text: "",
      fontFamily: "Calibri",
      fontSize: 12,
      padding: 5,
      visible: false,
      fill: "black",
      //alpha: 0.75,
      textFill: "white"
    });

    this.tooltipLayer.add(this.tooltip);

    this.stage.add(this.circlesLayer);
    this.stage.add(this.tooltipLayer);

Answer 1

不幸的是，如果在画布中绘制了工具提示。您当然可以使用html创建工具提示或使用画布上的title属性。