1

問題:

SVG グラフ バーの高さをアニメーション化しようとしています: http://jsfiddle.net/David_Knowles/pRTBt/

私の問題の一部は、 を返し.height()ますが、実際の高さを返します。0.attr("height")

$(function(){
var $theBars = $("#v-bars").children();
var BarsHeight = $theBars.each(function(index, element ) {
    var origHeight = $(this).attr("height");
    console.log( index + ": " + $(this).attr("height"));
    console.log( index + ": " + $(this).height());
});
});

高さをゼロに設定し、トリガーされjquery.animateたときに高さをアニメーション化することを計画しeventHanderていましたが、返された高さの問題のためにできないようです。

質問:

  1. なぜ.height()ゼロを返すのですか?
  2. たとえば、クリックしたときにバーに元の高さを適用する最良の方法は何でしょうか?

編集: 部分ソリューション http://jsfiddle.net/David_Knowles/pRTBt/12/

高さ属性を編集することができます。これは、値の配列を渡す方法を理解する必要があります

4

1 に答える 1

2

HTML では、高さと幅は CSS プロパティです。つまり<div style="height:100%;height:100%">、height() は 100% になります。SVGでは、高さと幅はXML属性なので、次のように記述します<rect height="100%" width="100%">

attr() は属性値を取得するため、機能します。

元の値をカスタム属性として保存できます。規則では、データから開始し、クリックするとカスタム属性値がバーに適用されます。

于 2013-05-20T15:18:58.033 に答える