एक तरीका, जो विशेष रूप से साफ नहीं है और विशेष रूप से अच्छी तरह से काम नहीं करेगा यदि आप एक ही समय में x- और y-axis टिक लेबल दिखाने की योजना बना रहे हैं, तो पर नकारात्मक पर labelMargin
विकल्प सेट करना है मूल्य।
var plot = $.plot(placeholder, data, {
...
grid: { ..., labelMargin: -20, ... }
...
});
एक दूसरा विचार सभी div
की जो class="tickLabel"
है के बाद ग्राफ चित्रित किया गया है हड़पने के लिए हो सकता है। और फिर "मैन्युअल" उनके सीएसएस पोजीशनिंग को बदल दें।
$("div.tickLabel").each(function(i,ele) {
ele = $(ele);
if (ele.css("text-align") == "center") { //x-axis
ele.css("top", ele.position().top - 20); //move them up over graph
} else { //y-axis
ele.css("left", ele.position().left + 20); //move them right over graph
}
});
बेशक
यह अभी भी x- और y- अक्ष पर सबसे कम टिक लेबल मानों एक दूसरे को और सबसे कम/उच्चतम टिक लेबल x- और y- अक्ष पर मान होंगे ओवरलैप के रूप में कुछ मुद्दे हैं ग्राफ के किनारों पर स्थित है। लेकिन कुछ ठीक-ट्यूनिंग के साथ यह एक व्यवहार्य समाधान हो सकता है।
एक तीसरा विचार सीधे x- और y- अक्ष की टिक लेबल के लिए एक tickFormatter
उपयोग करने के लिए किया जाएगा। यह दूसरे विचार के समान काम करता है लेकिन उन्हें सीधे स्थान पर रखेगा जहां आप चाहते हैं कि वे संभवतः "लेबल झिलमिलाहट" के बिना पुनर्स्थापन पर हो जाएं जो दूसरे विचार में फ़ंक्शन के साथ हो सकता है।
var plot = $.plot(placeholder, data, {
...
xaxis: {
...,
tickFormatter: function formatter(val, axis) {
//return appropriately absolute positioned element
}
},
...
});
इस tickFormatter
समारोह की तरह सबसे अच्छा jQuery Flot sourcecode को देखकर ली गई है दिखाई दे सकता है कैसे विशेष रूप से समारोह measureLabels
(यह आप इसका अंदाज़ा लगा Flot ही टिक लेबल की स्थिति हो जाता है) और डिफ़ॉल्ट टिक फ़ॉर्मेटर जो
तरह लग रहा है
function (v, axis) {
return v.toFixed(axis.tickDecimals);
};
क्या मेरा उत्तर संतोषजनक/काम नहीं कर रहा है? कृपया प्रतिक्रिया दें – jitter