मैं 7 या उससे कम अंकों के साथ चार्ट बना रहा हूं। मेरा पेज चार्ट प्रकारों के बीच स्विच करने की भी अनुमति देता है।
एरिया चार्ट को छोड़कर सभी चार्ट ठीक हैंचार्ट और अक्ष के किनारों के बीच काफी बड़ा सफेद स्थान। यह बस "अच्छा नहीं दिखता है, विशेष रूप से अन्य चार्ट के अंतर में। मैं चार्ट को पूरे चार्ट क्षेत्र पर कब्जा करना चाहूंगा। मुझे लगता है कि जब कई बिंदु होते हैं, तो अक्ष 90 ° घूमता है और चार्ट पूर्ण स्थान लेता है।
मैं इस व्यवहार को कैसे निर्दिष्ट कर सकता हूं? मैंने मार्जिन / सीमा के साथ गड़बड़ कर दी है, लेकिन यह भंगुर है।
http://jsbin.com/rihoredoja/1/edit
उत्तर:
जवाब के लिए 0 № 1यह इसलिए है क्योंकि आपने एक्स पर एक श्रेणी अक्ष का उपयोग किया है जो नियमित अंतराल पर प्रत्येक बिंदु को देता है। आपका चार्ट एक समय अक्ष के लिए बेहतर होगा:
var svg = dimple.newSvg("#chartContainer", 600, 400),
data = [
{ "year": "1998", "val": 123456789 },
{ "year": "1999", "val": 234567890 },
{ "year": "2000", "val": 234567890 },
{ "year": "2001", "val": 123456789 },
{ "year": "2002", "val": 134567890 },
{ "year": "2003", "val": 123456789 },
{ "year": "2004", "val": 234567890 }
],
c = new dimple.chart(svg, data),
x = c.addTimeAxis("x", "year", "%Y", "%Y"),
y = c.addMeasureAxis("y", "val"),
s = c.addSeries(null, dimple.plot.area);
c.draw();