2009-06-19 12 views
34

क्या Google चार्ट एपीआई के साथ एक चार्ट प्लॉट करने का कोई तरीका है ताकि X-axis मान एक महीने में दिन हो?Google चार्ट API के साथ एक्स-अक्ष में तिथियों का उपयोग कैसे करें?

मेरे पास डेटा पॉइंट हैं जो समान आवृत्ति के साथ प्रदान नहीं किए जाते हैं। उदाहरण के लिए:

Date - Value 
1/1/2009 - 100 
1/5/2009 - 150 
1/6/2009 - 165 
1/13/2009 - 200 
1/20/2009 - 350 
1/30/2009 - 500 

मैं एक चार्ट है कि सापेक्ष एक महीने के दौरान समय के आधार पर दूरी के साथ प्रत्येक डेटा बिंदु अलग कर देगा बनाना चाहते हैं। यह एक्सेल के साथ किया जा सकता है, लेकिन मैं इसे Google चार्ट के साथ कैसे गणना और प्रदर्शित कर सकता हूं?

Google चार्ट या एक मुफ्त लाइब्रेरी के समान अन्य निःशुल्क समाधान जिनका उपयोग एएसपी.नेट के साथ किया जा सकता है, भी आपका स्वागत है।

उत्तर

19

अद्यतन यह अब "एनोटेट चार्ट" सुविधा उन्नत रेखांकन का उपयोग कर लाइन चार्ट में सीधे समर्थित है के साथ नीचे - https://developers.google.com/chart/interactive/docs/gallery/annotationchart

मैं अपने ReHash Database Statistics चार्ट पर यह किया है (भले ही दिनांकों निकला समान रूप से स्थान दिया गया है ताकि यह वास्तव में प्रदर्शित नहीं करता है कि यह इस कर रहा है)।

सबसे पहले, आप अपने समग्र समय अवधि प्राप्त करना चाहते हैं, जो आपके चार्ट की समग्र चौड़ाई के अनुरूप होगा। ऐसा करने के लिए हम नवीनतम से सबसे पुरानी तारीख घटाते हैं। मैं यूनिक्स-युग टाइमस्टैम्प का उपयोग करना पसंद करता हूं क्योंकि वे पूर्णांक हैं और इस तरह तुलना करने में आसान हैं, लेकिन आप आसानी से सेकंड की संख्या की गणना कर सकते हैं, आदि

अब, अपने डेटा के माध्यम से लूप करें। प्रत्येक तिथि के लिए हम प्रतिशत की कुल अवधि में शुरुआत की तारीख से हैं (यानी सबसे पुरानी तिथि 0 है, नवीनतम 100 है)। प्रत्येक तिथि के लिए, आप डेटा सेट में सबसे पुरानी तारीख से वर्तमान दिनांक की दूरी की गणना करना चाहते हैं। अनिवार्य रूप से, "हम शुरुआत से कितने दूर हैं"। तो, वर्तमान तारीख से सबसे पुरानी तारीख घटाएं। फिर, प्रतिशतक को खोजने के लिए, हम समग्र समय अवधि द्वारा वर्तमान तिथि की दूरी विभाजित है, और फिर 100 से गुणा करें और काट-छांट या किसी दशमलव दौर हमारे अभिन्न x- निर्देशांक देने के लिए।

और यह उतना ही आसान है! आपके एक्स-वैल्यू 0 (चार्ट के बाएं किनारे) से लेकर 100 (दाईं ओर) तक होंगे और प्रत्येक डेटा बिंदु इसकी वास्तविक अस्थायी दूरी के संबंध में शुरुआत से दूरी पर स्थित होगा।

यदि आपके कोई प्रश्न हैं, तो बेझिझक पूछें! वांछित अगर मैं पेसुडोकोड या PHP पोस्ट कर सकते हैं।

+0

समझ में आता है ... मैं जो भी कर रहा था उससे भी बेहतर, और लागू करने के लिए आसान लगता है ... धन्यवाद !!! – jvanderh

+0

यह बहुत अच्छा काम करता है। सवाल यह है कि सही एक्स-लेबल्स कैसे सुनिश्चित करें। मेरे पास डेटा पॉइंट का बायां-स्केड सेट है, मैं स्केल को उसमें प्रतिनिधित्व करना चाहता हूं। अगर मैं सिर्फ पूरी रेंज को विभाजित करता हूं तो कहता हूं कि पांच एक्स-लेबल वास्तविक डेटा बिंदु से मेल नहीं खाएगा। –

+0

वही है जो मैं ईसाई को समझाता हूं, मैंने जो लिखा है उसे पढ़ें ... – defines

1

यह गूगल चार्ट के साथ किया जा सकता है काफी आसानी से, लेकिन अपने आवेदन लेबल

chxl चार्ट एक्स लेबल पैरामीटर की गणना करना चाहिए एक आप की जरूरत है। निम्न उदाहरण लेबल 50 चरणों में संख्या के साथ एक y- अक्ष, और तिथियों

chxl=0:|0|50|100|150|200|250|300|350|400|450|500|1:|16/01/2009|26/01/2009|6/02/2009 
+1

वह लेबल के बारे में नहीं पूछ रहा है, वह डेटा को समग्र समय सीमा में दिनांक की संबंधित स्थिति के सापेक्ष एक्स-अक्ष स्थिति में होने के बारे में पूछ रहा है। – defines

+0

ठीक है। लेकिन डाटा पॉइंट्स 1 (16/1), 2 (26/1) और 3 (6/2) आउटपुट चार्ट में एक ही दूरी के साथ अलग नहीं होंगे, यहां तक ​​कि पहले 2 और 12 के बीच 10 दिन हैं अंतिम 2? – jvanderh

+0

बिल्कुल डस्टिन, मेरा यही मतलब है। यह जानने के लिए कि मैं क्या कर रहा हूं, पिछली तारीख मान को दोहराए जाने की आवश्यकता है जब तक कि कोई नई तारीख उपलब्ध न हो जाए। इस तरह मेरे पास डेटा पॉइंट्स की निश्चित मात्रा है (उदाहरण के लिए 30) और कई मान दोहराए गए हैं। – jvanderh

0

Hai। मैं तुम्हारे जैसा ही सोच रहा हूं।मैं उन समस्याओं को पूर्ववत कर सकता हूं जहां लेबल एक-दूसरे को ओवरराइट करते हैं, और केवल दो दृष्टिकोणों के बारे में सोच सकते हैं।

1) प्रारूप (मोन/ट्यू, सोमवार/ट्यूसडे, 1 जन/1 फीब, 1 जनवरी, 2 9 फरवरी, 14/2/2010 ..etc) के आधार पर प्रत्येक दिनांक में कितने अक्षर पता लगाएं, फिर जानें गणना करें कि आप अपनी चार्ट चौड़ाई में कितने लेबल फिट कर सकते हैं (जो ग्रेनरी हो सकती है, जिसमें पिक्सेल में चार चौड़ाई (फिक्स्ड फोंट के लिए आसान), या केवल कुछ परीक्षण & त्रुटियां शामिल हैं)।

बेशक, आपके लेबल सीधे किसी भी डेटा के साथ संरेखित हो सकते हैं।

2) एकाधिक एक्स-अक्ष लेबल का उपयोग करें और अपनी तिथियों को लंबवत रखें।

10

मुझे एक ही समस्या थी, Google चार्ट पर scatter plots मिला, यह वास्तव में आवश्यक है।

यहाँ कोड मैं के साथ समाप्त हो गया (एक प्रारंभिक बिंदु के रूप में उनकी लिया) है:

function drawVisualization() { 
    // Create and populate the data table. 
    var data = new google.visualization.DataTable(); 
    data.addColumn('date', 'Date'); 
    data.addColumn('number', 'Quantity'); 
    data.addRow([new Date(2011, 0, 1), 10]) 
    data.addRow([new Date(2011, 1, 1), 15]) 
    data.addRow([new Date(2011, 3, 1), 40]) 
    data.addRow([new Date(2011, 6, 1), 50]) 


    // Create and draw the visualization. 
    var chart = new google.visualization.ScatterChart(
     document.getElementById('visualization')); 
    chart.draw(data, {title: 'Test', 
         width: 600, height: 400, 
         vAxis: {title: "cr", titleTextStyle: {color: "green"}}, 
         hAxis: {title: "time", titleTextStyle: {color: "green"}}, 
         lineWidth: 1} 
      ); 
} 

ध्यान दें कि वे 0 से महीनों की गिनती करने लगते हैं, यानी जनवरी 0 है, 1 फ़रवरी है ..., दिसंबर 11 है।

संबंधित मुद्दे