2010-11-26 5 views
1

baxartの下にテキストラベルをx軸の下にflotで中央揃えしようとしています。 FLOTから
オリジナルのマークアップは次のようになります。flotでxaxisラベルを移動する

<div style="position: absolute; text-align: center; left: 0px; top: 185px; width: 79px;" class="tickLabel"><span class="chart-label">Lorem</span></div> 

このコードは、これまでのトリックを行っているが、あった場合、私は思っていた:

<div style="position: absolute; text-align: center; left: -20px; top: 185px; width: 79px;" class="tickLabel"><span class="chart-label">Lorem</span></div> 

私は、得られたラベルのマークアップは次のようになりたいですラベルを整列させるより良い方法です。

$.each($('.chart-label'),function(idx,el){ 
var c = $(el); 
var value = c.parent().css('left'); 
c.parent().css('left',parseInt(value)+20+'px'); 
}); 

左の属性がインラインであるため、CSSのプレースメントを上書きすることはできません。

答えて

2

あなたは一人でCSSを使用することができます。

.tickLabel .chart-label { padding-left:20px } 

それとも、ここではあなたにマイナーな改善です:

$('.tickLabel').each(function(){ 
    var me = $(this); 
    me.css('left',parseInt(me.css('left'))+20+'px'); 
}); 
関連する問題