Stoqs: "कंटूर प्लॉट" रेडियो बटन जोड़ें

इस नई सुविधा को लागू करने के लिए फुल स्टैक डेवलपर कौशल की आवश्यकता है। क्लाइंट-साइड पर लिखा जाने वाला HTML और जावास्क्रिप्ट (JQuery) है। AJAX को UI और सर्वर के बीच डेटा पास करने के लिए समझा जाना चाहिए। सर्वर-साइड पर पायथन कोड होता है जिसे प्लॉटिंग करने के लिए लिखने की आवश्यकता होती है। इसे पूरा करने के लिए सेलेनियम का उपयोग करके एक कार्यात्मक परीक्षण लिखा जाएगा। (आदर्श रूप से, सही टीडीडी पद्धति का पालन करने के लिए परीक्षा पहले लिखी जाएगी!)

आपका स्वागत है @J0S349 , @noemicuin , @LeslyGJ , @samuelrey! मुझे खुशी है कि आपने इस मुद्दे को उठाया। यह कुछ ऐसा है जिसका अनुरोध हमारे वैज्ञानिकों में से एक ने किया है और मुझे लगता है कि वे इस सुविधा को पाकर खुश होंगे।

कल एमबीएआरआई के दौरे के दौरान हम एक पोस्टर के पास से गुजरे जिसमें इस तरह की साजिश का एक उदाहरण था जो यह नई सुविधा प्रदान करेगी:

शीर्ष प्लॉट तापमान को रंगों के रूप में और सफेद समोच्च रेखाओं के रूप में भी दिखाता है। निचला प्लॉट क्लोरोफिल को रंग के रूप में दिखाता है और सफेद समोच्च रेखाएं शीर्ष प्लॉट, तापमान के समान होती हैं।

STOQS UI में जोड़ी जाने वाली विशेषता किसी भी पैरामीटर की समोच्च रेखाओं को जोड़ने की क्षमता है।

https://github.com/stoqs/stoqs/pull/501 द्वारा जोड़ा गया test_contour_plots() परीक्षण ~/dev/stoqsgit से निष्पादित किया जा सकता है:

export DJANGO_SETTINGS_MODULE=config.settings.ci
export DATABASE_URL=postgis://127.0.0.1:5432/stoqs
stoqs/manage.py test stoqs.tests.functional_tests.BrowserTestCase.test_contour_plots

यदि आप डिबग ब्रेक पॉइंट में वापस डालते हैं जिसे https://github.com/stoqs/stoqs/pull/501/commits/b976d708e13fd208df3f29c6f12bd1692e427e38 द्वारा हटा दिया गया था, तो आपको इस तरह की एक विंडो देखनी चाहिए:

ध्यान दें कि कार्यात्मक परीक्षणों को निष्पादित करने के लिए विकास सर्वर को चलाने की आवश्यकता है। सुनिश्चित करें कि इसे किसी अन्य टर्मिनल सत्र में निष्पादित किया गया है:

cd ~/dev/stoqsgit && source venv-stoqs/bin/activate
export DATABASE_URL=postgis://stoqsadm:[email protected]:5432/stoqs
stoqs/manage.py runserver 0.0.0.0:8000 --settings=config.settings.ci

"समोच्च रेखाओं की साजिश" सुविधा के लिए एक कार्यात्मक परीक्षण की शुरुआत इस तरह दिख सकती है:

-        # TODO: Add tests for contour line plot
+        # Tests for contour line plot
+        parameter_contour_plot_radio_button = self.browser.find_element(By.XPATH,
+            "//input[@name='parameters_contour_plot' and @value='{}']".format(northward_sea_water_velocity_HR_id))

जिसके साथ विफल हो जाएगा:

NoSuchElementException: Message: Unable to locate element: //input[@name='parameters_contour_plot' and @value='17']

मैं ब्रेकपॉइंट जोड़ने और अनुपलब्ध तत्व का अनुरोध करने वाली लाइन जोड़ने में सक्षम था।

हाय @सैमुएलरे ,

एक दम बढ़िया! क्या आप अपने कोड परिवर्तन को एक नई शाखा में धकेल सकते हैं ताकि हम सभी इसे देख सकें?

अरे @MBARIMike मुझे और परीक्षण मामलों के साथ आने में परेशानी हो रही है।
जिसे मैंने कार्यान्वित किया है, एक छवि उत्पन्न होने की अपेक्षा करता है जब समोच्च रेडियो बटनों में से एक दबाया जाता है।
एक और जो मैंने सोचा था वह यह सत्यापित करना था कि रंगीन बटन के बराबर संख्या में समोच्च बटन उत्पन्न होते हैं। यह मेरी समझ का अनुसरण करता है कि डेटा द्वारा वर्णित मापदंडों के अनुसार रेडियो बटन गतिशील रूप से निर्मित होते हैं।

हैलो @samuelrey (और टीम),

यदि आप हैरी पर्सीवल के ट्यूटोरियल से टीडीडी के उदाहरण का अनुसरण करना चाहते हैं तो आपका अगला कदम https://github.com/stoqs/stoqs/issues/230#issuecomment -280171422 पास से परीक्षण करने के लिए कोड जोड़ना है।

परीक्षण कोड parameters_contour_plot नामक इनपुट तत्व की तलाश में विफल रहता है। मौजूदा वेब पेज में parameters_plot नाम के रेडियो बटन का एक कॉलम है। मेरा सुझाव है कि https://github.com/stoqs/stoqs/blob/master/stoqs/stoqs/templates/stoqs/stoqsquery.html फ़ाइल में इस स्ट्रिंग की तलाश parameters_contour_plot नामक रेडियो बटन का एक कॉलम जोड़ने के लिए समान कोड जोड़ें

जब आपका परीक्षण पास हो जाता है तो अपनी शाखा में परिवर्तन करें। फिर अगला टेस्ट लिखें।

नमस्ते @MBARIMike ,

हमने अब सभी गैर-कार्यात्मक रेडियो बटनों को इस प्रकार कार्यान्वित किया है: parameters_contour_plot समोच्च भूखंड के लिए परीक्षणों के साथ-साथ यह सुनिश्चित करने के लिए कि वे उत्पन्न होते हैं। हमारे लिए अगला कदम कंटूर रेडियो बटन की कार्यक्षमता को लागू करना होगा।

@MBARIMike भी हम शुक्रवार, 31 मार्च (सीज़र शावेज दिवस) को मिलने के लिए उपलब्ध नहीं हैं, लेकिन हम किसी भी अन्य शुक्रवार से मिलना चाहेंगे जो आपको हमारी प्रगति दिखाने और हमारे लिए आपके किसी भी सुझाव पर चर्चा करने के लिए उपलब्ध हो। हमें बताएं कि आपके लिए सबसे अच्छा क्या काम करता है।

बड़ी प्रगति दिख रही है!

क्या आप इन कोड परिवर्तनों के लिए शाखा को लिंक प्रदान कर सकते हैं?

यहाँ कोड परिवर्तन हैं:
https://github.com/samuelrey/stoqs/commit/01fd692e5010fb6aa287899b5d7afb5bd10e9825
https://github.com/samuelrey/stoqs/commit/a3173e7368528c17f3a57ab5daf4ae4aa730153a (फ़ाइल के अंत में)
https://github.com/samuelrey/stoqs/commit/3122a4ee412b859e949549ebf7e384a61c9fb438 (परीक्षण)

मेरे वीएम में मैंने देखा कि फ़ायरफ़ॉक्स विंडो ऑफ स्क्रीन दिखाई देती है। मुझे नहीं पता कि आपको उस समस्या का सामना करना पड़ा है, लेकिन stoqs/stoqs/tests/functional_tests.py यह परिवर्तन इसे ठीक करता है:

--- a/stoqs/stoqs/tests/functional_tests.py
+++ b/stoqs/stoqs/tests/functional_tests.py
@@ -48,9 +48,6 @@ class BrowserTestCase(TestCase):
     def setUp(self):
         profile = webdriver.FirefoxProfile()
         self.browser = webdriver.Firefox(profile)
-        self.browser.set_window_size(1200, 768)
-        self.browser.set_window_position(300, 0)
-        self.browser.implicitly_wait(10)

यहाँ थोड़ा मार्गदर्शन है:

1. शीर्षक और स्पष्ट चयन पंक्तियों में कॉलम संरेखण में थोड़ी सफाई की आवश्यकता है
2. parameters_contour_plot नामित रेडियो बटन पर क्लिक के लिए एक हैंडलर जोड़ें। यह जावास्क्रिप्ट कोड मौजूदा प्लॉट बटन के लिए हैंडलर है। यह एक क्वेरीस्ट्रिंग बनाता है जिसे तब सर्वर पर भेज दिया जाता है जहां समोच्च प्लॉट उत्पन्न किया जाएगा। क्वेरीस्ट्रिंग में parameters_contour_plot जोड़ने के लिए समान कोड जोड़ने की आवश्यकता है।

जैसे ही वे सर्वर-साइड कोड में आते हैं, अगले चरण थोड़े गड़बड़ होने लगते हैं:

1. parametercontourplot के लिए Stoqs/stoqs/views/query.py पायथन कोड में लाइनें जोड़ें
2. फ़ाइल में Stoqs/utils/STOQSQManager.py यहाँ के आसपास कॉन्टूरपैरामीटरआईडी और कॉन्टूरपैरामीटरग्रुप्स को खींचने के लिए कोड जोड़ें और उन्हें मेजर्डपैरामीटर () के लिए तर्क सूची में जोड़ें।
3. फ़ाइल Stoqs/utils/Viz/plotting.py में समोच्चपैरामीटर आईडी और कंटूरपैरामीटर समूह को मापित पैरामीटर

इस बिंदु पर आपका कार्यात्मक परीक्षण stoqs.tests.functional_tests.BrowserTestCase.test_contour_plots पास होना चाहिए और आपके पास उस पैरामीटर आईडी तक पहुंच होगी जिसे आपको इसकी आवश्यकता के लिए चुना गया है ( renderDatavaluesForFlot() MeasuredParameter विधि कक्षा)।

मैं जावास्क्रिप्ट फ़ंक्शन ले रहा हूँ!

अपने सभी कच्चे गौरव में अंतिम प्रतिबद्ध । हमने इस टिप्पणी में सूचीबद्ध सब कुछ समाप्त कर दिया है। अब हम वास्तव में डेटा की साजिश रचने पर काम कर रहे हैं! प्लॉटिंग.पी में संशोधन किया जाएगा।

रंग प्लॉट बनाने की कोशिश करते समय मुझे एक समस्या का सामना करना पड़ा। डेटा ['पैरामीटरप्लेटफ़ॉर्मडेटावैल्यूपीएनजी'] में [अशक्त, अशक्त, 'पैरामीटर-समोच्च-प्लॉट-रेडियो बटन जानकारी प्राप्त करने में समस्या'] है। यहां एक ब्रेकपॉइंट सेट

इस लाइन से 'पैरामीटर-समोच्च-प्लॉट-रेडियो बटन जानकारी प्राप्त करने में समस्या' टेक्स्ट आ रहा है।

ओह, यह मेरा गलत काम है।
इस त्रुटि के लिए मेरा अनुमान है कि 'प्लेटफ़ॉर्मनाम' 'समोच्च प्लैटफ़ॉर्मनाम' होना चाहिए? या कोई अन्य समाधान 'contourplatformName' की जांच न करना हो सकता है?
कोई भी सलाह अनावश्यक मात्रा में कमिट से बचने में मदद करेगी।

_fillXYZ और loadData विधियों में बहुत सारे कोड होते हैं जिन्हें समोच्च रेखा चर के लिए पुन: उपयोग किया जा सकता है। हो सकता है कि फ़ंक्शन के भीतर सदस्य चर सेट करने के बजाय, हम उन सूचियों को वापस करने के लिए फ़ंक्शन को संशोधित कर सकते हैं जो वे उत्पन्न करते हैं।

if contourParameterID:
    self.clx, self.cly, self.clz = self.loadData(...)

यह सोचकर कि समोच्च रेखा x, y, और z चर के लिए डेटा भरने के लिए प्लॉटिंग.py में loadData() विधि का पुन: उपयोग कैसे किया जाए। यहाँ के पास इस तरह के संशोधन के बारे में आप क्या सोचते

diff --git a/stoqs/utils/Viz/plotting.py b/stoqs/utils/Viz/plotting.py
index 81c278b..cfe679c 100644
--- a/stoqs/utils/Viz/plotting.py
+++ b/stoqs/utils/Viz/plotting.py
@@ -556,6 +556,12 @@ class MeasuredParameter(BaseParameter):

             if not self.x and not self.y and not self.z:
                 self.loadData()
+            if contourParameterID is not None:
+                if not self.clx and not self.cly and not self.clz:
+                    self.loadData()
+                    self.clx = self.x
+                    self.cly = self.y
+                    self.clz = self.z

कृपया इस पुल अनुरोध को देखें जो समानांतर समोच्च_क्यूएस_एमपी बनाने के लिए "खरगोश छेद" में गहराई से गोता लगाता है और समोच्च रेखा पैरामीटर डेटा मान प्राप्त करने के लिए लोडडेटा() का पुन: उपयोग करने में आपकी सहायता करता है। अब आप समोच्च रेखाएँ बनाने के लिए clx, cly और clz चरों का उपयोग करने में सक्षम होंगे।

@samuelrey कृपया https://github.com/stoqs/stoqs/pull/578 की आधार शाखा को capstone-spring2017 शाखा में बदलें। इसे कैसे करना है, इसके निर्देश यहां दिए गए हैं: https://github.com/blog/2224-change-the-base-branch-of-a-pull-request

इसके एक अलग शाखा में होने से वृद्धिशील विलय का प्रबंधन करना आसान हो जाएगा।

मैं इसे दिन के अंत तक पूरा कर लूंगा! जाना अच्छा है।

अछा लगता है! क्या आपने भी देखा ये छोटा सा निवेदन ?

आंकड़ा सहेजे जाने से ठीक पहले, मैं सम्मिलित करता हूं

                if self.contourParameterID is not None:
                    CS = ax.contour(clx, cly, clz)
                    ax.clabel(CS, fontsize=9, inline=1)

जो z के आकार के संबंध में एक त्रुटि फेंकता है।
समोच्च प्रलेखन कहता है कि x, y और z या तो समान आकार के साथ 2d होना चाहिए या x और y की लंबाई 1d होनी चाहिए जिसकी लंबाई z में पंक्तियों की संख्या के बराबर हो।

आपको ग्रिड वाले वेरिएबल्स में पास करने की आवश्यकता है, जो उसी तरह से उत्पादित होते हैं जैसे xi, yi, और zi उत्पन्न होते हैं।

ओह, मैंने इसे देखा। समझ गया!

यहां देखें कि हमारा कोड क्या उत्पादन करने में सक्षम था। माइक द्वारा किए गए अपडेट के कारण UI और छवि गुणवत्ता अब अलग दिखाई देगी; हालाँकि, यह वही है जो CSUMB STOQS टीम देने में सक्षम थी।

CSUMB STOQS टीम द्वारा पूर्ण किए गए कार्य का त्वरित सारांश प्रदान करने के लिए, हमने पहले से मौजूद कोड के माध्यम से फ़िल्टर किया और आवश्यकतानुसार समायोजन किया। इनमें से एक समायोजन रेडियो बटनों का एक नया कॉलम जोड़ रहा था, इसलिए UI के पास समोच्च रेखाओं को मैप करने का विकल्प था; ये UI परिवर्तन मेरे और @LeslyGJ द्वारा किए गए थे। नए प्रारूप का अनुसरण करते हुए, उन बटनों से भी संबंध स्थापित करने थे; जावास्क्रिप्ट में परिवर्तन करने से @samuelrey ने उस कार्य को पकड़ लिया। सर्वर-साइड कोड के पीछे अजगर में गोता लगाते समय एक और समायोजन आया; @samuelrey और मैंने नए चर जोड़े और नए मापदंडों से गुजरे। UI परिवर्तन, और सर्वर-साइड संशोधनों के साथ, @J0S349 और @samuelrey ने नए परीक्षण मामले बनाकर या कोड पास करने और ट्रैक पर वापस लाने के लिए जहां कहीं भी आवश्यक हो, परिवर्तन करके परीक्षण पूर्णता की निगरानी की।