Gruodžio | 2007 | Paul Galvin SharePoint kosmoso

Apžvalga:

(NAUJINIMAS 12/04/07: Pridėti kitas įdomus šaltinis susieti į vieną dienoraštį, kad adresą tai per labai įdomus puslapio dalies pabaigoje)

Šio dienoraščio įrašas aprašoma, kaip sukurti histogramoje SharePoint. Tai veikia WSS ir samanų aplinkoje, kaip jį tik priklauso nuo duomenų rodinio puslapio dalis.

Bendras požiūris yra toks:

Sukurti sąrašą arba dokumentų biblioteką, kurioje duomenis norite į diagramą.
Vieta susijusių dokumentų biblioteką / pasirinktinio sąrašo į puslapį ir konvertuoti jį į duomenų rodinio puslapio dalis (DVWP).
Pakeisti į DVWP XSL generuoti HTML, kuri parodo kaip grafiką.

Verslo scenarijus / Sąranka:

Aš sukūriau pasirinktinį sąrašą su standarto pavadinimas stulpelį ir vieną papildomą stulpelį, "Statusas". Šis modeliai (labai gerokai) Išlaidų leidimas"" scenarijų kai pavadinimas atstovauja projekto ir statuso vertę iš sąrašo:

Pasiūlė
Procese
Įstrigo

Tikslas yra teikti interaktyvios horizontalios juostos grafa, kuri rodo šie būsenos kodai.

Aš jau gyvena sąraše ir jis atrodo taip:

Sukurti duomenų rodinio puslapio dalis:

Kurti su DVWP pridedant pasirinktinį sąrašą į puslapį (svetainės puslapyje mano atveju) ir vykdykite čia (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!395.entry).

Be to, tiesiog kuriant į DVWP, mums taip pat reikia nustatyti ypatybę perkrauties parodyti visų laisvų eilučių. Man, tai atrodo maždaug taip:

Šiuo metu, Aš visada uždaryti BPD ir naršyklės. Aš tada iš naujo Atidarykite puslapį naudojant naršyklę. Taip išvengiama netyčia mucking iki žiniatinklio dalies išdėstymo puslapyje.

Modifikuoti XSLT:

Dabar atėjo laikas pakeisti XSLT.

Aš visada naudoti visual studio tai. (Žr. čia svarbi pastaba apie intellisense, kurie padės jums daug).

Sukurti tuščią projektą įtraukti keturi nauji failai (pakeisti žodžiai "originali" ir "New" atitinkamai):

Original.XSLT
New.XSLT
Originalus Params.xml
Naujas Params.xml

Mano atveju, atrodo, kad tai:

Keisti puslapio dalį ir kopijuoti parametrus ir XSL "pradinėje" Visual Studio versija.

Čia siekiama sukelti XSL rezultatais mes grįžti iš DVWP užklausos į HTML, kad tampa kaip grafiką.

Šiuo tikslu, ji padeda pirma nuomone kas HTML turėtų atrodyti prieš mes susipainioti veiksnumas, kuris yra žinomas kaip "XSL". (Turi būti aišku, Žemiau yra tiesiog pavyzdys; nereikia įvesti jį arba kopijuoti ir įklijuoti į visual studio. Aš turiu pateikti visą smūgį atskaitos taškas, kad vëliau rašymą į viršų). Šie mėginys diagrama būtų generuojamas kaip HTML iš karto po:

Atitinkamus HTML:

<HTML>
<įstaiga>
<centras>
<stalo plotis = 80 %>
<TR><TD><centras>Horizontali histograma</TD></TR>
<TR>
<TD align = "centrą">
<lentelės kraštinėje = "1" plotis = 80 %>
<TR>
<TD plotis = 10 %>Atidaryti</TD>
<TD><lentelės cellpadding ="0" cellspacing ="0" sienos = 0 plotis = 50 %><TR bgcolor = red><TD> </TD></TR></lentelė></TD>
</TR>
<TR>
<TD plotis = 10 %>Uždarytas</TD>
<TD><lentelės cellpadding ="0" cellspacing ="0" sienos = 0 plotis = 25 %><TR bgcolor = red><TD> </TD></TR></lentelė></TD>
</TR>
<TR>
<TD plotis = 10 %>Įstrigo</TD>
<TD><lentelės cellpadding ="0" cellspacing ="0" sienos = 0 plotis = 25 %><TR bgcolor = red><TD> </TD></TR></lentelė></TD>
</TR>
</lentelė>
</TD>
</TR>
</lentelė>
</įstaiga>
</HTML>

Aš miręs paprasta požiūris sukurti mano barų iš nusistatykite fono spalvą iš eilės, "raudona".

Išsinešimui čia tai: Galiausiai, visi mes darome yra sukurti HTML su eilučių ir stulpelių.

Šablono XSLT:

Nukopijavau XSLT, kuris generuoja horizontalioje histogramoje. Tai gana gerai pastebėjo, kad nebus pridėti daug čia išskyrus šios pastabos:

Aš pradėjau su numatytąjį XSL, kuris SharePoint Designer davė man, kai aš pirmą kartą sukurta pagal DVWP.
Man pavyko sumažinti tai nuo BPD 's 657 eilučių 166 linijos.
Aš ne pažaisti su parametrų XML faile (kuri yra atskirta nuo XSL ir jūs žinote, ką reiškia, kai jūs einate į keisti DVWP, pati; ten yra du failai, keičiant). Tačiau, siekiant supaprastinti, Aš padariau beveik visi iš jų pašalinti XSL. Tai reiškia, kad jei jūs norite naudoti šiuos parametrus, jums tik reikia pridėti jų kintamųjų apibrėžimai atgal į XSL. Kad bus lengva, nes jūs turite pradinio XSL kintamųjų apibrėžimai visual studio projekte.
Jums turėtų turėti galimybę nukopijuokite ir įklijuokite šį tiesiai į jūsų visual studio projekto. Tada, pašalinti mano skambučius ir įrašyti savo skambučius į "ShowBar".
Darbų sukuriant detalizavimas, <a href> va taip: http://server/List?FilterField1=fieldname&FilterValue1=actualFilterValue. Šis metodas gali būti vertės kituose kontekstuose. Iš pradžių, Maniau, kad man reikia kad atitiktų sudėtingesnes formatas: http://server/List/AllItems.aspx?View={guid}&FilterField1=blah&FilterValue1=blah, bet mano aplinkoje tai nėra būtina. Į sąrašą URL perduodama mums iš SharePoint, tai gana paprasta apibendrinti.

Čia yra:

<XSL:stilių versija="1.0" neįtraukti-rezultatas-priešdėlių="RS z o s ddwrt dt msxsl" 
 xmlns:msxsl="Balsuokite:schemas-microsoft-com:XSLT" xmlns:XSL="http://www.w3.org/ 1999/pertvarkymą" 
 xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" 
 xmlns:ASP="http://schemas.microsoft.com/ASPNET/20" xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" 
 xmlns:o="Balsuokite:schemas-microsoft-com:tarnyba" xmlns:s="UUID naudojimas:BDC6E3F0-6DA3-11d1-A2A3-00AA00C14882" 
 xmlns:DT="UUID naudojimas:C2F41010-65B3 - 11d 1-A29F-00AA00C14882" xmlns:RS="Balsuokite:schemas-microsoft-com:eilučių rinkinio" xmlns:z="#RowsetSchema" 
 xmlns:ddwrt2="Balsuokite:FrontPage:vidaus">
  <XSL:išvesties metodas="HTML" įtrauka="ne" />
  <XSL:dešimtainis formatas NaN="" />
  <XSL:param vardas, pavadinimas="ListUrlDir"></XSL:param> <!-- Man reikia remti yra detalizavimo.  -->

  <XSL:šablonas rungtynės="/" xmlns:SharePoint="Microsoft.SharePoint.WebControls" 
 xmlns:__designer=http://schemas.microsoft.com/WebParts/v2/DataView/designer xmlns:ASP="http://schemas.microsoft.com/ASPNET/20">
    <XSL:kintamasis vardas, pavadinimas="dvt_StyleName">Lentelė</XSL:kintamasis>
    <XSL:kintamasis vardas, pavadinimas="Eilučių" Pasirinkite="/dsQueryResponse/eilučių/eilučių" />
    <XSL:kintamasis vardas, pavadinimas="dvt_RowCount" Pasirinkite="skaičius($Eilučių)" />
    <XSL:kintamasis vardas, pavadinimas="IsEmpty" Pasirinkite="$dvt_RowCount = 0" />
    <XSL:kintamasis vardas, pavadinimas="dvt_IsEmpty" Pasirinkite="$dvt_RowCount = 0" />

    <XSL:pasirinkti>
      <XSL:kada bandymas="$dvt_IsEmpty">
        Nėra duomenų kreivę!<br/>
      </XSL:kada>
      <XSL:kitaip>

        <!--
          Įdomių dalykų čia prasideda.

          Mums reikia nustatyti kintamųjų kiekvienoje eilutėje poros grafikas: bendras skaičius elementus ir procentais nuo bendro.
        -->
        <XSL:kintamasis vardas, pavadinimas="totalProposed" Pasirinkite="skaičius(/dsQueryResponse/eilučių/eilučių[normalizuoti vietos(@Status) = "Siūlomi"])" />
        <XSL:kintamasis vardas, pavadinimas="percentProposed" Pasirinkite="$totalProposed div $dvt_RowCount" />

        <XSL:kintamasis vardas, pavadinimas="totalInProcess" Pasirinkite="skaičius(/dsQueryResponse/eilučių/eilučių[normalizuoti vietos(@Status) = "Procese"])" />
        <XSL:kintamasis vardas, pavadinimas="percentInProcess" Pasirinkite="$totalInProcess div $dvt_RowCount" />

        <XSL:kintamasis vardas, pavadinimas="totalStalled" Pasirinkite="skaičius(/dsQueryResponse/eilučių/eilučių[normalizuoti vietos(@Status) = "Sustojo"])" />
        <XSL:kintamasis vardas, pavadinimas="percentStalled" Pasirinkite="$totalStalled div $dvt_RowCount" />

        <!--
          Mes nustatome mūsų HTML lentelės čia.  Aš esu skolinimosi iš kai kurių standartinių SharePoint stilių čia suderinti.  Manau, kad tai bus garbė pasaulio css failo keitimai taip pat tema pakeičia.
        -->
        <lentelė plotis="100%" cellspacing="0" cellpadding="2"
stilius="sienos-teisė: 1 kieta #C0C0C0; sienos apačioje: 1 kieta #C0C0C0; sienos kairėje-stiliaus: kietas; sienos-kairės-plotis: 1; siena viršų-stiliaus: kietas; sienos viršaus pločio: 1;">

           <TR>
            <TD suderinti="centras">
              <lentelė sienos="1" plotis="100%">

                <!--
                  Už kiekvieną būseną, kuri norime grafikas, Mes vadiname "ShowBar" šablonas.
                  Mes perduoti jį:
                  1. Eilės etiketė.  Tai yra transformuojami į hipersaitą.
                  2. Procentas (kintamasis iš viršaus).
                  3. Faktinė lauko pavadinimas iš pagrindinės sąrašo kodas.  Tai nėra būtina suderinti ekranas etiketės.
                  4. Lauko vertė suderinta #3.
                  5. Bendras elementų, šis būsenos kodas (ne bendrą visų būsenos kodai).

                  Ji skleidžia a <TR></TR> ir horizontalioje histogramoje linija.

                  Mes vadiname šį šabloną kiekvieno būsenos kodo norime Rodyti.
                -->
                <XSL:Call-template vardas, pavadinimas="ShowBar">
                  <XSL:su param vardas, pavadinimas="BarDisplayLabel" Pasirinkite=""Siūlomi""/>
                  <XSL:su param vardas, pavadinimas="BarPercent" Pasirinkite="$percentProposed"/>
                  <XSL:su param vardas, pavadinimas="QueryFilterFieldName" Pasirinkite=""Statusas""/>
                  <XSL:su param vardas, pavadinimas="QueryFilterFieldValue" Pasirinkite=""Siūlomi""/>
                  <XSL:su param vardas, pavadinimas="TotalItems" Pasirinkite="$totalProposed"></XSL:su param>
                </XSL:Call-template>

                <XSL:Call-template vardas, pavadinimas="ShowBar">
                  <XSL:su param vardas, pavadinimas="BarDisplayLabel" Pasirinkite=""Sustojo""/>
                  <XSL:su param vardas, pavadinimas="BarPercent" Pasirinkite="$percentStalled"/>
                  <XSL:su param vardas, pavadinimas="QueryFilterFieldName" Pasirinkite=""Statusas""/>
                  <XSL:su param vardas, pavadinimas="QueryFilterFieldValue" Pasirinkite=""Sustojo""/>
                  <XSL:su param vardas, pavadinimas="TotalItems" Pasirinkite="$totalStalled"></XSL:su param>
                </XSL:Call-template>

                <XSL:Call-template vardas, pavadinimas="ShowBar">
                  <XSL:su param vardas, pavadinimas="BarDisplayLabel" Pasirinkite=""Procese""/>
                  <XSL:su param vardas, pavadinimas="BarPercent" Pasirinkite="$percentInProcess"/>
                  <XSL:su param vardas, pavadinimas="QueryFilterFieldName" Pasirinkite=""Statusas""/>
                  <XSL:su param vardas, pavadinimas="QueryFilterFieldValue" Pasirinkite=""Procese""/>
                  <XSL:su param vardas, pavadinimas="TotalItems" Pasirinkite="$totalInProcess"></XSL:su param>
                </XSL:Call-template>

              </lentelė>
            </TD>
          </TR>
        </lentelė>
      </XSL:kitaip>
    </XSL:pasirinkti>
  </XSL:šablonas>

  <!--
    Šis šablonas veikia Rodyti atskiros eilutės stulpeli┼│ grafikas.

    Jūs tikriausiai padaryti didžiąją dalį jūsų tweaking čia.
  -->
  <XSL:šablonas vardas, pavadinimas="ShowBar">
    <XSL:param vardas, pavadinimas="BarDisplayLabel" /> <!-- etiketės parodyti -->
    <XSL:param vardas, pavadinimas="BarPercent"/> <!-- Procentais nuo bendro. -->
    <XSL:param vardas, pavadinimas="QueryFilterFieldName"/> <!-- Naudojami pereiti prie užklausos & filtras -->
    <XSL:param vardas, pavadinimas="QueryFilterFieldValue"/> <!-- Naudojami pereiti prie užklausos & filtras -->
    <XSL:param vardas, pavadinimas="TotalItems" /> <!-- bendras skaičius šiame barlabel -->

    <TR>

      <!-- Baro etiketės pati. -->
      <TD klasės="MS-formbody" plotis="30%">

        <!--
          Šis kitą atskaitomybės rinkinys stato užklausos eilutę, kuri leidžia mums naudoti detalizavimą ir filtruotas rodinys pagal giliau esančių duomenų.
          Mes naudoti keletą dalykų čia:
          1. Mes galime perduoti FilterField1 ir FilterValue1 į sąrašą filtruoti stulpelyje.
          2. SharePoint bėga pagrindiniai parametrai mums, ListUrlDir, kurį nurodo pagrindinės sąrašas nuo kurių šis DVWP "veikia".

          Nėra XSL įdomus?
        -->
        <XSL:tekstas išjungti-produkcija-pabėgti="taip">
        <![CDATA[<a href ="]]></XSL:tekstas>
        <XSL:vertė Pasirinkite="$ListUrlDir"/>
        <XSL:tekstas išjungti-produkcija-pabėgti="taip"><![CDATA[?FilterField1 =]]></XSL:tekstas>
        <XSL:vertė Pasirinkite="$QueryFilterFieldName"/>
        <XSL:tekstas išjungti-produkcija-pabėgti="taip"><![CDATA[&FilterValue1 =]]></XSL:tekstas>
        <XSL:vertė Pasirinkite="$QueryFilterFieldValue"/>
        <XSL:tekstas išjungti-produkcija-pabėgti="taip"><![CDATA[">]]></XSL:tekstas>
        <XSL:vertė Pasirinkite="$BarDisplayLabel"/>
        <XSL:tekstas išjungti-produkcija-pabėgti="taip"><![CDATA[</a>]]></XSL:tekstas>

        <!-- Kitą bitų rodo keletą skaičių formatas: "(iš viso / % iš viso)" -->
        (<XSL:vertė Pasirinkite="$TotalItems"/> /

        <!-- Tai sukuria gražus procentų etiketės mums.  ačiū, Microsoft! -->
        <XSL:Call-template vardas, pavadinimas="percentformat">
          <XSL:su param vardas, pavadinimas="procentų" Pasirinkite="$BarPercent"/>
        </XSL:Call-template>)

      </TD>

      <!-- Pagaliau, išmesti su <TD> žymių juostos pati.-->
      <TD>
        <lentelė cellpadding="0" cellspacing="0" sienos="0"
plotis="{turas($BarPercent * 100)+1}%">
          <TR bgcolor="raudona">
            <XSL:tekstas išjungti-produkcija-pabėgti="taip"><![CDATA[&nbsp;]]></XSL:tekstas>
          </TR>
        </lentelė>
      </TD>
    </TR>

  </XSL:šablonas>

  <!-- Tai yra paimami tiesiai iš kai kurių XSL radau MS šablone. -->
  <XSL:šablonas vardas, pavadinimas="percentformat">
    <XSL:param vardas, pavadinimas="procentų"/>
    <XSL:pasirinkti>
      <XSL:kada bandymas="formatas-numeris($procentų, '#,##0%;-#,##0%')= 'NaN'">0%</XSL:kada>
      <XSL:kitaip>
        <XSL:vertė Pasirinkite="formatas-numeris($procentų, '#,##0%;-#,##0%')" />
      </XSL:kitaip>
    </XSL:pasirinkti>
  </XSL:šablonas>

</XSL:stilių>

Rezultatai:

XSL iš viršaus generuoja Šis grafikas:

Detalizuoti iki pagrindžiantys duomenys paspaudę ant būsenos kodas yra:

Pabaigos mintys:

Tai gali būti apibendrintas?

Aš myliu šią diagramų sudarymo koncepciją, bet man nepatinka tai, kad aš turiu eiti ir padaryti tiek daug rankų-kodavimo. Aš daviau mažai apgalvotos ar jis gali būti apibendrintas ir aš optimistiškai, bet aš taip pat mažai bijo, kad gali būti plytų siena kažkur palei kelią, kad negali pasiūlyti bet apeiti. Jei kas nors turi keletą idėjų apie tai, Prašome būti pažymėta komentarus arba rašykite man.

Vertikalus grafikai:

Tai yra horizontalioje histogramoje. Tai tikrai įmanoma sukurti vertikali grafikas. Mes tiesiog reikia pakeisti HTML. Norėčiau pradėti taip pat: Sukurti HTML pateikimas vertikalus histograma ir tada suprasti, kaip gauti, kad per XSL. Jei kas nors yra suinteresuotas, kad, Aš galėtų būti įsitikinęs, kad jį išbandyti ir dirbti iš the kinks. Jei kas nors turi jau padaryta, kad, Praneškite man ir aš mielai pateiksiu nuorodą į jūsų tinklaraštį 🙂

Manau, kad vertikali grafikas uždavinys kad etiketės grafikui sudaryti yra kur kas sunkiau valdyti, bet tikrai ne neįmanoma.

Lauko pavadinimas Gotcha:

Yra ne mažiau kaip du dalykai atkreipti dėmesį, su jūsų laukų pavadinimus.

Pirmosios, lauko pavadinimas su vietos turi būti pakeistas į XSL. Tai tikriausiai bus problema čia:

        <XSL:kintamasis vardas, pavadinimas="totalProposed" 
 Pasirinkite="skaičius(/dsQueryResponse/eilučių/eilučių[normalizuoti vietos(@Status) = "Siūlomi"])" />

Jei būseną"" stulpelyje iš tikrųjų pavadintas "būsenos kodas" tada jums reikia nuoroda kaip "Status_x0020_Code":
   <XSL:kintamasis vardas, pavadinimas="totalProposed" 
 Pasirinkite="skaičius(/dsQueryResponse/eilučių/eilučių[normalizuoti vietos(@Status_x0020_Code) = "Siūlomi"])" />
Antrojo, ir aš esu šiek tiek neaiškus šiuo, bet jūs taip pat turite būti perspėjimas dėl lauko pavadinimas keičiasi. Jei pavadinimą savo srityje "būsenos kodas" ir vėliau, pervardykite jį į "Titas būsena", "vidaus pavadinimas" nekeičia. Vidaus pavadinimas bus "būsenos kodas" ir turi būti nurodyti kaip "Status_x0020_Code". "Kitos lėšos" nuorodos gali padėti diagnozuoti ir taisyti tokios problemos.

Apie šios spalvos:

Mane pasirinko "raudona" nes tai malonus man metu. Būtų baisi parodyti skirtingų spalvų būtų ne tik vizualiai Aprašymas skaičiaus, bet taip pat teikti naudinga KPI. Pvz., jei procentinė dalis "užstrigo" AFE 's > 10% Tada parodyti jį raudona, kitaip parodyti jį juoda. Naudoti <XSL:pasirinkti> Norėdami tai atlikti.

Kitų išteklių:

Vidaus pavadinimo (ir kitos geros info) duomenų sąrašo: http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!134.entry
Rodyti visus duomenis SharePoint pateikiamas (žalias XML): http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!190.entry
Gauti konkretų stulpelį XPATH išraiška: http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!155.entry
Kitas būdas naudojant OWA(?). Aš ne kasti į jį, bet vilčių, ypač dėl skritulinės diagramos: http://www.waka.dk/Blog/PermaLink,guid,e2532e71-d774-4ac9-8f25-883964b830f4.aspx

Laimingas transformuojant!

Prenumeruoti savo dienoraštį!

Technorati Tags: SharePoint, DVWP, Duomenų rodinio puslapio dalis, XSL, XSLT, WSS, SAMANŲ

Paul Galvin SharePoint kosmoso

mėnesio Archyvai: Gruodžio 2007

Sukurti baras diagramų SharePoint