अवलोकन:
(अद्यतन 12/04/07: अंत में एक और ब्लॉग है कि यह पता लगाता है के माध्यम से एक बहुत ही दिलचस्प वेब पार्ट को जोड़ने के एक और दिलचस्प संसाधन में जोड़ा)
इस ब्लॉग प्रविष्टि में SharePoint एक पट्टी ग्राफ़ बनाने के लिए कैसे का वर्णन करता है. यह केवल डेटा दृश्य वेब पार्ट पर निर्भर करता है के रूप में यह दोनों WSS और MOSS के वातावरण में काम करता है.
समग्र दृष्टिकोण इस प्रकार है:
- ग्राफ़ करें करने के लिए इच्छित डेटा वाला एक सूची या दस्तावेज़ लायब्रेरी बनाएँ.
- संबद्ध दस्तावेज़ लाइब्रेरी प्लेस / कस्टम सूची पृष्ठ पर और यह एक डेटा दृश्य वेब पार्ट करने के लिए कनवर्ट करें (DVWP).
- DVWP XSL एक ग्राफ के रूप में पता चलता है कि HTML जनरेट करने के लिए संशोधित करें.
व्यापार परिदृश्य / सेटअप:
मैं एक कस्टम सूची के साथ मानक शीर्षक स्तंभ और एक अतिरिक्त स्तंभ बनाया है, "स्थिति". इस मॉडल (बहुत ही simplistically) एक "प्राधिकरण के खर्च के लिए" परिदृश्य जहाँ शीर्षक परियोजना और स्थिति मान की सूची से प्रतिनिधित्व:
- प्रस्तावित
- प्रक्रिया में
- ठप
एक इंटरैक्टिव क्षैतिज पट्टी ग्राफ़ इन स्थिति कोड पता चलता है कि उत्पादन के लिए उद्देश्य है.
मैं सूची पॉपुलेटेड है और यह इस तरह दिखता है:
डेटा दृश्य वेब पार्ट बनाना:
एक पृष्ठ पर कस्टम सूची को जोड़कर DVWP बनाएँ (मेरे मामले में साइट पेज) और दिए गए निर्देशों का पालन करें यहाँ (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!395.entry).
बस DVWP बनाने के साथ, हम भी सभी उपलब्ध पंक्तियों को दिखाने के लिए पेजिंग गुण सेट करने की आवश्यकता है. मेरे लिए, यह कुछ इस तरह दिखता है:
इस बिंदु पर, मैं हमेशा एसपीडी और ब्राउज़र बंद करें. मैं तब ब्राउज़र का उपयोग कर पेज पुनः खोलना. इस पेज पर वेब पार्ट लेआउट अप अकस्मात mucking से बचा जाता है.
XSLT संशोधित करें:
अब यह समय XSLT संशोधित करने के लिए है.
मैं हमेशा इस बात के लिए दृश्य स्टूडियो उपयोग. (देखें यहाँ intellisense कि तुम एक बहुत मदद मिलेगी के बारे में के लिए एक महत्वपूर्ण नोट).
मैं एक रिक्त प्रोजेक्ट बनाने चार नई फ़ाइलें जोड़ें ("मूल शब्दों की जगह" और "नया" उचित रूप में):
- Original.xslt
- New.xslt
- मूल Params.xml
- नया Params.xml
मेरे मामले में, यह इस तरह दिखता है:
वेब पार्ट को संशोधित करें और params और XSL मूल"करने के लिए प्रतिलिपि बनाएँ" Visual Studio में संस्करण.
हम वापस कि एक ग्राफ के रूप में renders HTML में DVWP क्वेरी से प्राप्त परिणामों को बदलने के लिए XSL पैदा करने के लिए यहाँ उद्देश्य है.
यह अंत करने के लिए, इसे पहले इससे पहले कि हम "XSL के रूप में" ज्ञात है कि पागलपन से उलझन में मिल क्या HTML की तरह दिखना चाहिए पर विचार करने में मदद करता है. (स्पष्ट होना करने के लिए, बस एक उदाहरण निम्न है; नहीं इसे टाइप या कॉपी/दृश्य स्टूडियो में चिपकाएँ. मैं एक पूरा झटका उस के लिए बाद में लिखने में प्रारंभिक बिंदु प्रदान करते हैं). निम्न नमूना ग्राफ के तुरंत बाद HTML के अनुसार गाया है:
संगत HTML:
<html> <शरीर> <केंद्र> <तालिका चौड़ाई = 80%> <टी. आर.><td><केंद्र>क्षैतिज पट्टी ग्राफ़</td></टी. आर.> <टी. आर.> <टीडी संरेखित करें = "सेंटर"> <तालिका बॉर्डर = "1" चौड़ाई = 80%> <टी. आर.> <टीडी चौड़ाई = 10%>खुला</td> <td><तालिका cellpadding ="0" cellspacing ="0" बॉर्डर चौड़ाई 0 = = 50%><tr bgcolor = लाल><td> </td></टी. आर.></तालिका></td> </टी. आर.> <टी. आर.> <टीडी चौड़ाई = 10%>बंद कर दिया</td> <td><तालिका cellpadding ="0" cellspacing ="0" बॉर्डर चौड़ाई 0 = = 25%><tr bgcolor = लाल><td> </td></टी. आर.></तालिका></td> </टी. आर.> <टी. आर.> <टीडी चौड़ाई = 10%>ठप</td> <td><तालिका cellpadding ="0" cellspacing ="0" बॉर्डर चौड़ाई 0 = = 25%><tr bgcolor = लाल><td> </td></टी. आर.></तालिका></td> </टी. आर.> </तालिका> </td> </टी. आर.> </तालिका> </शरीर> </html> |
मैं एक मरा सरल दृष्टिकोण के "रेड" के लिए एक पंक्ति का पृष्ठभूमि रंग सेट करके मेरी सलाखों के बनाने के लिए इस्तेमाल किया.
यह है लेने दूर यहाँ है: अंत में, सब हम क्या कर रहे हैं HTML बनाना है पंक्तियों और स्तंभों के साथ.
टेम्पलेट XSLT:
मैं एक क्षैतिज पट्टी ग्राफ़ उत्पन्न XSLT नकल है. यह काफी अच्छी तरह से है टिप्पणी की है तो मैं बहुत इन नोटों को छोड़कर यहाँ जोड़ नहीं होगा:
- मैं डिफ़ॉल्ट XSL कि SharePoint डिजाइनर मुझे दे दिया जब मैं पहली बार DVWP बनाया के साथ शुरू कर दिया.
- मैं इस एसपीडी से नीचे कट कर रहा था 657 लाइनों के लिए 166 लाइनों.
- मैं पैरामीटर XML फ़ाइल के साथ चारों ओर गंदगी नहीं था (जो XSL से अलग है और आप जब तुम DVWP खुद को संशोधित करने के लिए जाना है कि मैं क्या मतलब पता चल जाएगा; वहाँ दो फ़ाइलें आप संशोधित कर सकते हैं). हालांकि, आदेश में यह आसान बनाने के लिए, मैं उनमें से लगभग सभी XSL से दूर किया. इसका मतलब यह है कि यदि आप चाहते हैं उन मापदंडों का उपयोग करें, तुम बस अपने चर परिभाषाएँ XSL को वापस जोड़ने के लिए की जरूरत है. चूंकि आप अपने दृश्य स्टूडियो परियोजना में मूल XSL चर परिभाषाएँ होगा कि आसान हो जाएगा.
- आप की प्रतिलिपि बनाएँ और यह सीधे आपके दृश्य स्टूडियो परियोजना में चिपकाएँ करने में सक्षम होना चाहिए. तब, मेरे कॉल निकालें और "ShowBar" करने के लिए अपने स्वयं कॉल सम्मिलित करें.
- बनाने के द्वारा काम करता है नीचे ड्रिल एक <एक href> इस तरह: http://server/List?FilterField1=fieldname&FilterValue1=actualFilterValue. इस तकनीक अन्य संदर्भों में मूल्य की जा सकती. पहली बार में, मैंने सोचा कि मैं एक और अधिक जटिल स्वरूप के अनुरूप करने के लिए की आवश्यकता होगी: http://server/List/AllItems.aspx?View={guid}&FilterField1=blah&FilterValue1=blah, लेकिन मेरे वातावरण में आवश्यक नहीं है कि. यह काफी आसान के लिए सामान्य है, तो सूची URL करने के लिए हमें SharePoint द्वारा पारित हो जाता है.
यहाँ यह है:
<xsl:शैली पत्रक संस्करण="1.0" शामिल नहीं करें-परिणाम-उपसर्ग="रु z o एस ddwrt डीटी msxsl" |
परिणाम:
इस ग्राफ ऊपर से XSL उत्पन्न करता है:
स्थिति कोड पर क्लिक करके अंतर्निहित डेटा के लिए नीचे ड्रिल:
विचार समापन:
इस सामान्यीकृत किया जा कर सकते हैं?
मैं इस रेखांकन अवधारणा प्यार करता हूँ, लेकिन मैं इस तथ्य है कि मैं जाना है और इतना सारा हाथ-कोडिंग करते है नफरत. मैं दिया है चाहे इसे सामान्यीकृत किया जा सकता करने के लिए थोड़ा सोचा और मैं आशावादी हूँ, लेकिन मैं भी थोड़ा भयभीत कि कहीं किसी भी काम के आसपास की पेशकश नहीं होगा मार्ग के किनारे एक ईंट की दीवार हो सकता हूँ. अगर किसी को इस पर कुछ अच्छे विचार है, कृपया टिप्पणी में एक नोट बनाएँ या ईमेल मुझे.
अनुलंब रेखांकन:
यह एक क्षैतिज पट्टी ग्राफ़ है. यह निश्चित रूप से एक ऊर्ध्वाधर ग्राफ़ बनाने के लिए संभव है. हम सिर्फ परिवर्तन HTML करने के लिए की जरूरत है. मैं उसी तरह शुरू होगा: एक एक अनुलंब पट्टी ग्राफ़ के HTML प्रतिनिधित्व बनाएँ और तब कि XSL के जरिए पाने के लिए बाहर आंकड़ा. अगर किसी को उस में रुचि है, मैं इसे बाहर की कोशिश करो और kinks बाहर काम करने के लिए राजी किया जा सकता है. अगर किसी को पहले से ही किया है कि, please let me know and I’ll gladly link to your blog 🙂
मुझे लगता है कि एक ऊर्ध्वाधर ग्राफ के साथ चुनौती है कि ग्राफ के लिए लेबल्स का प्रबंधन करने के लिए और अधिक कठिन हैं, लेकिन निश्चित रूप से नहीं असंभव.
फ़ील्ड नाम पकड़ लिया:
वहाँ कम से कम दो बातें आपकी फ़ील्ड के नाम के साथ के लिए देखो करने के लिए कर रहे हैं.
प्रथम, XSL में बच गए किया जा करने के लिए एक स्थान के साथ एक फ़ील्ड नाम है. यह शायद एक मुद्दा यहाँ हो जाएगा:
<xsl:चर नाम="totalProposed"
का चयन करें="गिनती(/dsQueryResponse/पंक्तियों/पंक्ति[मानक के अनुसार अंतरिक्ष(@Status) 'प्रस्तावित' =])" />
यदि आपकी स्थिति"" स्तम्भ वास्तव में "स्थिति कोड नाम दिया गया है" तो आप की जरूरत है इसे "Status_x0020_Code" के रूप में संदर्भित करने के लिए:
<xsl:चर नाम="totalProposed"
का चयन करें="गिनती(/dsQueryResponse/पंक्तियों/पंक्ति[मानक के अनुसार अंतरिक्ष(@Status_x0020_Code) 'प्रस्तावित' =])" />दूसरा, और मैं इस पर थोड़ा फजी हूँ, लेकिन तुम भी फ़ील्ड नाम परिवर्तन के लिए सतर्क होने की जरूरत. यदि आप अपने "स्थिति कोड फ़ील्ड नाम" और फिर बाद में, यह "AFE स्थिति" करने के लिए का नाम बदलें, "आंतरिक नाम" परिवर्तन नहीं करता है. आंतरिक नाम अभी भी "स्थिति कोड हो जाएगा" और "Status_x0020_Code" के रूप में संदर्भित किया जाना चाहिए. 'अन्य संसाधन" लिंक्स का निदान करें और इस तरह की समस्या को ठीक मदद कर सकते हैं.
उस रंग के बारे में:
मैं "लाल उठाया" क्योंकि यह इस वक्त मेरे पास भाता है. यह दिखाने के अलग अलग रंग के रूप में अधिक से अधिक सिर्फ एक संख्या का एक दृश्य विवरण उपलब्ध कराने के लिए एक बड़ा सौदा नहीं होगा, लेकिन इसके अलावा एक उपयोगी KPI प्रदान करने के लिए. उदाहरण के लिए, यदि का प्रतिशत "ठप" AFE की है > 10% तो यह लाल शो, अन्यथा यह काले रंग में दिखाएँ. का प्रयोग करें <xsl:चुनें> यह पूरा करने के लिए.
अन्य संसाधनों:
- आंतरिक नाम का निर्धारण (और अन्य अच्छी जानकारी) एक सूची में डेटा के लिए: http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!134.entry
- सभी SharePoint द्वारा उपलब्ध कराई गई डेटा दिखाएँ (रॉ XML): http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!190.entry
- XPATH व्यंजक किसी विशिष्ट स्तंभ के हो जाओ: http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!155.entry
- OWA का उपयोग कर किसी अन्य दृष्टिकोण(?). मैं इसे में खोदा नहीं है, होनहार, लेकिन लगता है, पाइ चार्ट के लिए विशेष रूप से: http://www.waka.dk/Blog/PermaLink,guid,e2532e71-d774-4ac9-8f25-883964b830f4.aspx
खुश को बदलने!
<अंत />