【问题标题】:Quickinfo for Rectangle SVG Object/Raphael JS矩形 SVG 对象/Raphael JS 的快速信息
【发布时间】:2013-05-23 06:53:00
【问题描述】:

我正在使用 Raphael JS 来绘制矩形对象。 JS 编码由运行时转换为 ABAP 编码并显示在内部浏览器中。 虽然显示一切都很好,但我想在将鼠标移到 SVG 对象上时发布一个特定的 Qucikinfo。有谁知道如何通过矩形对象发布快速信息?通过单击对象获得信息也可以。我不想使用圆形对象..

abap:

CONCATENATE: 'var' a_name '= paper.rect(' a_x_pos ',' a_y_pos ','
a_width ',' a_height ',' a_corner_radius ');'
INTO l_html_line SEPARATED BY space.

js:

var name = paper.rect( x_pos, y_pos, width, height, corner_radius)

【问题讨论】:

    标签: javascript svg raphael svg-animate


    【解决方案1】:

    你可以看看这个:http://stratha.us/raphael_js_tooltip

    代码非常小:

    Raphael.el.tooltip = function (tp) {
      this.tp = tp;
      this.tp.ox = 0;
      this.tp.oy = 0;
      this.tp.hide();
      this.hover(
        function(event) { 
          this.mousemove(function(event) { 
            this.tp.translate(event.clientX - 
              this.tp.ox,event.clientY - this.tp.oy);
            this.tp.ox = event.clientX;
            this.tp.oy = event.clientY;
          });
          this.tp.show().toFront();
        }, 
        function(event) {
          this.tp.hide();
          this.unmousemove();
        }
      );
      return this;
    };
    

    那你只需要打电话

    name.tooltip( paper.text( 0 , 0 , "Hi, I am a tooltip" ) );
    

    另一方面,ABAP 代码看起来非常难以维护。我会邀请您在 codereview.stackexchange.com 上发布整个代码,我相信有更好的方法来做到这一点。

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-12-26
    • 1970-01-01
    • 1970-01-01
    • 2011-02-20
    相关资源
    最近更新 更多