2013-01-16 47 views
4

我使用flot和插件「jquery.flot.axislabels.js」,但我找不到README文件以外的其他文檔。 所以一般的問題是「我在哪裏可以找到一些完整的文檔?」 更具體的一個是:「如何設置標籤的顏色?」 有些屬性可用,如「axisLabelFontSizePixels」,「axisLabelFontFamily」等等,所以我嘗試了「axisLabelColor」和「axisLabelFontColor」而沒有任何結果。flot.axislabels:如何選擇標籤的顏色?

我也嘗試過使用CSS,根據這個:http://people.mozilla.com/~mcote/flot-axislabels/example/ 但它也不起作用。也許CSS正在使用舊版本的axislabel.js。

理想情況下,我會避免這樣做與CSS,我想如果我們能夠選擇字體,我們可以選擇顏色。但我不能找到什麼語法我一定要使用...

如果有人知道的東西,我很樂意閱讀它:-) 感謝和問候, S.

回答

10

從查看源代碼它看起來不像插件在兩種操作模式中的任何一種中提供該選項:

1.)使用畫布繪製標籤 - 無法設置顏色(僅限字體系列和大小)。如果您使用JavaScript,添加顏色不會太困難。 (您可能使用此選項,因爲它解釋了爲什麼您的CSS不起作用。)

2.)使用HTML DIV繪製標籤。這是你的鏈接例子。其中作者通過內聯CSS標籤指定顏色。如何將它做到這一點雖然保持在一起是你的情節電話:

$('.yaxisLabel').css('color','red'); 
    $('.y2axisLabel').css('color','orange'); 
    $('.y3axisLabel').css('color','green'); 
    $('.y4axisLabel').css('color','purple'); 

here

+0

嗨,非常感謝,這是答案:「axisLabelUseCanvas:true」必須刪除,如果我們希望能夠設置標籤的顏色。有關信息,「axisLabelUseHtml:true」(我試過)並不是更好。只是不要設置它們中的任何一個。似乎很簡單,但我曾嘗試過很多選擇;-) – user992157

+3

這些類不適合我。但是我檢查了代碼並發現這個函數可以工作\t'$('。flot-y1-axis').css('color','#00b3e3');''等於y1,y2,y3 – Federico

0

我必須設置axisLabelUseCanvas:false明確,並使用$('.axisLabels').css('color','red');讓他們紅

2

我發現它簡單到只需添加!important目標由海軍報生成的類。對於定位軸,您可以瞄準.yaxisLabel.xaxisLabel,或針對整個目標.flot-text

.flot-text { 
    color: rgba(255, 255, 255, 0.3) !important 
} 
0

我知道這個問題有一個公認的答案,但只要一想到分享如何我終於得到它的工作。

FLOT版本:0.8.3海軍報

我必須明確地設置axisLabelUseCanvas:false,然後寫一點jQuery代碼:

$('.flot-tick-label').css('color','red');

還有我們去,幾個挫折小時後,它終於紅了!

希望這可以幫助失去Flot的人。

相關問題