2016-08-23 33 views
0

我遇到了一個問題與火狐
(是的,通常的罪魁禍首是IE瀏覽器,但他這次表現很好)。爲什麼firefox會爲空格生成多個<tspan>,我怎樣才能防止它

我使用的C3 API生成的柱狀圖,和格式化刻度值的時間
(x)軸與此moment格式 - MMM D, YYYY
(它也恰好與純文本,但我寧願寫我所做的)。

Chrome和IE顯示一行蜱(例如,「2003年10月3日」)
但Firefox打破它分成兩行(注意這裏的逗號後沒有空格) -
Oct 3, 2003

即使更糟 -
由於圖形的高度,第二行會在半高處切割。

我檢查這個問題在DOM結構,
並發現,在Chrome和IE中的內容是<text>元素中,
而Firefox拆分<text>元素的內容分成幾個<tspan>元素
(全部受到被刪除的白色空間的影響)。

我檢查過谷歌博士,找不到一種方法來強制FF不分裂文本。

我感謝所有幫助(大大)

更新:圖形的here is the jsfiddle link(無視它沒有列數據的事實)。

+0

我認爲我們需要[mcve]有任何機會來回答這個問題。 –

+0

感謝您的留言,並感到抱歉,不提前提供。 – GrizzlyMcBear

+0

它看起來像一個C3問題。您可以調試C3並查看它的行爲。我的猜測是,在FF中,它發現它沒有足夠的空間容納整個文本,所以它將它分成基於空格的碎片。 –

回答

0

請檢查更新的jsfiddle: -

https://jsfiddle.net/L1b47kdd/26/

我只是刪除在y軸的格式,這個問題是在Firefox瀏覽器。請檢查..

format: d3.format("d") 
相關問題