Archives mensuelles: Décembre 2007

Créer des graphiques à barres dans SharePoint

Vue d'ensemble:

(MISE À JOUR 12/04/07: Ajouter une autre ressource intéressante à la fin qui relie à un autre blog qui traite de cela via une partie très intéressante de web)

Ce blog décrit comment créer un graphique à barres dans SharePoint. Cela fonctionne dans les environnements fois WSS et MOSS, puisqu'il dépend seulement du composant WebPart Affichage de données.

L'approche globale est la suivante:

  1. Créer une liste ou bibliothèque de documents qui contient les données que vous voulez graphique.
  2. Place de la bibliothèque de documents associés / personnalisé la liste sur une page et de le convertir à un composant WebPart Affichage de données (DVWP).
  3. Modifier XSL de la DVWP pour générer le code HTML qui présente sous forme de graphique.

Scénario d'entreprise / Programme d'installation:

J'ai créé une liste personnalisée avec la colonne de titre standard et une colonne supplémentaire, « Status ». Ce modèles (de manière très simpliste) une « autorisation de dépense" scénario où le titre représente le projet et le statut d'une valeur de la liste des:

  • Proposé
  • Dans le processus
  • Au point mort

L'objectif est de produire un diagramme à barres horizontales interactive qui montre ces codes d'État.

J'ai rempli la liste et il ressemble à ceci:

image

Créer le composant WebPart Affichage de données:

Créer le DVWP en ajoutant la liste personnalisée à une page (page du site dans mon cas) et suivez les instructions ici (http://paulgalvin.spaces.live.com/blog/cns!1CC1EDB3DAA9B8AA!395.entry).

En plus de créer simplement le DVWP, Nous devons également définir la propriété de pagination pour afficher toutes les lignes disponibles. Pour moi, Cela ressemble à quelque chose comme ça:

image

À ce point, J'ai toujours de fermer SPD et le navigateur. J'ai ensuite ré-ouvrir la page en utilisant le navigateur. Cela évite de déblayage accidentellement jusqu'à la mise en page web part sur la page.

Modifier la transformation XSLT:

Il est maintenant temps de modifier la transformation XSLT.

J'ai toujours utiliser visual studio pour cela. (Voir ici pour une remarque importante sur intellisense qui vous aidera beaucoup).

J'ai créer un projet vide ajouter quatre nouveaux fichiers (remplaçant les mots "Original" et "New" le cas échéant):

  • Original.XSLT
  • New.XSLT
  • Original Params.xml
  • Nouveau Params.xml

Dans mon cas, Il ressemble à ceci:

image

Modifier le composant WebPart, puis copiez les params et XSL à l'Original"" version dans Visual Studio.

L'objectif ici est de provoquer le XSL transformer les résultats que nous revenir de la requête DVWP dans HTML qui est restitué sous un graphe.

À cette fin, Il est utile d'examiner tout d'abord ce que le code HTML devrait ressembler avant que nous ayons confondus par la folie qui est connue comme « XSL ». (Pour être clair, Ceci est simplement un exemple; ne pas taper ou copier/coller dans visual studio. Je fournis un coup complet, point de départ pour que plus tard dans l'écriture). Le graphique suivant est rendu selon le code HTML qui suit immédiatement:

Bar échantillon graphique

HTML correspondant:

<html>
<corps>
<Centre>
<table width = 80 %>
<TR><TD><Centre>Graphique à barres horizontales</TD></TR>
<TR>
<TD align = « center »>
<bordure de table = "1" largeur = 80 %>
<TR>
<TD largeur = 10 %>Ouvert</TD>
<TD><table cellpadding ="0" CellSpacing ="0" border = 0 width = 50 %><TR bgcolor = rouge><TD>&nbsp;</TD></TR></table></TD>
</TR>
<TR>
<TD largeur = 10 %>Fermé</TD>
<TD><table cellpadding ="0" CellSpacing ="0" border = 0 width = 25 %><TR bgcolor = rouge><TD>&nbsp;</TD></TR></table></TD>
</TR>
<TR>
<TD largeur = 10 %>Au point mort</TD>
<TD><table cellpadding ="0" CellSpacing ="0" border = 0 width = 25 %><TR bgcolor = rouge><TD>&nbsp;</TD></TR></table></TD>
</TR>
</table>
</TD>
</TR>
</table>
</corps>
</html>

J'ai utilisé une approche simple pour créer mes barres en définissant la couleur d'arrière-plan d'une ligne « rouge ».

La vente à l'emporter ici est la suivante: En fin de compte, tout ce que nous faisons est création HTML contenant des lignes et des colonnes.

Modèle XSLT:

J'ai copié le XSLT qui génère un graphique à barres horizontal. Il est assez bien donc je n'ajoutera beaucoup ici à l'exception de ces notes a commenté:

  • J'ai commencé avec la valeur par défaut XSL que SharePoint Designer m'a donné quand j'ai d'abord créé le DVWP.
  • J'ai été capable d'abattre du SPD 657 lignes à 166 lignes.
  • Je na pas perdre son temps avec le fichier de paramètres XML (qui est séparé de la XSL et vous saurez ce que je veux dire, quand vous allez à modifier le DVWP lui-même; Il y a deux fichiers, que vous pouvez modifier). Cependant, afin de simplifier, La quasi-totalité d'entre eux a fait retirer de XSL. Cela signifie que si vous voulez faire usage de ces paramètres, vous avez juste besoin d'ajouter leurs définitions variables vers le XSL. Qui ne sera pas facile puisque vous aurez les définitions originales de variable XSL dans votre projet visual studio.
  • Vous devriez être en mesure de copier et coller ce directement dans votre projet visual studio. Puis, enlever mes appels et insérer vos propres appels à « ShowBar ».
  • Le zoom fonctionne en créant un <a href> Comme ça: http://server/List?FilterField1=fieldname&FilterValue1=actualFilterValue. Cette technique peut être utile dans d'autres contextes. Dans un premier temps, J'ai pensé que j'aurais besoin pour se conformer à un format plus complexe: http://server/List/AllItems.aspx?View={guid}&FilterField1=blah&FilterValue1=blah, mais dans mon environnement qui n'est pas nécessaire. URL de la liste est passée à nous par SharePoint, donc c'est assez facile de généraliser.

C'est ici:

<XSL:feuille de style Version="1.0" exclure-résultat-préfixes="RS z o s ddwrt dt msxsl" 
xmlns:msxsl="urn:schemas-microsoft-com:XSLT" xmlns:XSL="http://www.w3.org/ 1999/transformation/XSL"
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="urn:schemas-microsoft-com:Bureau" xmlns:s="UUID:BDC6E3F0-6DA3-11D1-A2A3-00AA00C14882"
xmlns:DT="UUID:C2F41010-65B3 - 11d 1-A29F-00AA00C14882" xmlns:RS="urn:schemas-microsoft-com:ensemble de lignes" xmlns:z="#RowsetSchema"
xmlns:ddwrt2="urn:FrontPage:interne"
> <XSL:sortie méthode="html" tiret="ne" /> <XSL:format décimal NaN="" /> <XSL:Param nom="ListUrlDir"></XSL:Param> <!-- J'ai besoin de ça pour soutenir une exploration. --> <XSL:modèle match de football="/" xmlns:SharePoint="Microsoft.SharePoint.WebControls"
xmlns:__designer=http://schemas.microsoft.com/WebParts/v2/DataView/designer xmlns:ASP="http://schemas.microsoft.com/ASPNET/20"
> <XSL:variable nom="dvt_StyleName">Table</XSL:variable> <XSL:variable nom="Lignes" Sélectionnez="/dsQueryResponse/lignes/en rangée" /> <XSL:variable nom="dvt_RowCount" Sélectionnez="comte($Lignes)" /> <XSL:variable nom="IsEmpty" Sélectionnez="$dvt_RowCount = 0" /> <XSL:variable nom="dvt_IsEmpty" Sélectionnez="$dvt_RowCount = 0" /> <XSL:choisir> <XSL:Lorsque test="$dvt_IsEmpty"> Il n'y a pas de données au graphique!<br/> </XSL:Lorsque> <XSL:autrement> <!-- Les trucs intéressants commence ici. Nous devons définir une paire de variables pour chaque ligne dans le graphique: nombre total d'éléments et pourcentage du total. --> <XSL:variable nom="totalProposed" Sélectionnez="comte(/dsQueryResponse/lignes/en rangée[Normalize-space(@Status) = « Proposée »])" /> <XSL:variable nom="percentProposed" Sélectionnez="$totalProposed div $dvt_RowCount" /> <XSL:variable nom="totalInProcess" Sélectionnez="comte(/dsQueryResponse/lignes/en rangée[Normalize-space(@Status) = "Dans le processus"])" /> <XSL:variable nom="percentInProcess" Sélectionnez="$totalInProcess div $dvt_RowCount" /> <XSL:variable nom="totalStalled" Sélectionnez="comte(/dsQueryResponse/lignes/en rangée[Normalize-space(@Status) = « Calé »])" /> <XSL:variable nom="percentStalled" Sélectionnez="$totalStalled div $dvt_RowCount" /> <!-- Nous définissons notre table HTML ici. Je suis empruntant certains styles SharePoint standards ici pour la rendre cohérente. Je pense qu'il honorera les modifications dans le fichier css global ainsi que le thème substitue. --> <table Largeur="100%" CellSpacing="0" CellPadding="2" style="border-right: 1 #C0C0C0 solides; border-bottom: 1 #C0C0C0 solides; border-left-style: solide; border-left-width: 1; border-top-style: solide; border-top-width: 1;"> <TR> <TD aligner="Centre"> <table frontière="1" Largeur="100%"> <!-- Pour chaque situation que nous voulons graphique, Nous appelons le « ShowBar" modèle. Nous passons il: 1. Une étiquette pour la ligne. C'est transformé en un lien hypertexte. 2. Le pour cent (variable d'en haut). 3. Le véritable nom du champ du code de la liste sous-jacente. Cela ne doit pas nécessaire correspondre à l'étiquette d'affichage. 4. Valeur de champ correspondant pour #3. 5. Total des Articles de ce code d'État (pas le total de tous les codes d'État). Il émet une <TR></TR> et la ligne du diagramme à barres horizontales. Nous appelons ce modèle pour chaque code d'État que nous voulez afficher. --> <XSL:appel-modèle nom="ShowBar"> <XSL:avec-param nom="BarDisplayLabel" Sélectionnez="« Proposée »"/> <XSL:avec-param nom="BarPercent" Sélectionnez="$percentProposed"/> <XSL:avec-param nom="QueryFilterFieldName" Sélectionnez="« Statut »"/> <XSL:avec-param nom="QueryFilterFieldValue" Sélectionnez="« Proposée »"/> <XSL:avec-param nom="TotalItems" Sélectionnez="$totalProposed"></XSL:avec-param> </XSL:appel-modèle> <XSL:appel-modèle nom="ShowBar"> <XSL:avec-param nom="BarDisplayLabel" Sélectionnez="« Au point mort »"/> <XSL:avec-param nom="BarPercent" Sélectionnez="$percentStalled"/> <XSL:avec-param nom="QueryFilterFieldName" Sélectionnez="« Statut »"/> <XSL:avec-param nom="QueryFilterFieldValue" Sélectionnez="« Au point mort »"/> <XSL:avec-param nom="TotalItems" Sélectionnez="$totalStalled"></XSL:avec-param> </XSL:appel-modèle> <XSL:appel-modèle nom="ShowBar"> <XSL:avec-param nom="BarDisplayLabel" Sélectionnez=""Dans le processus""/> <XSL:avec-param nom="BarPercent" Sélectionnez="$percentInProcess"/> <XSL:avec-param nom="QueryFilterFieldName" Sélectionnez="« Statut »"/> <XSL:avec-param nom="QueryFilterFieldValue" Sélectionnez=""Dans le processus""/> <XSL:avec-param nom="TotalItems" Sélectionnez="$totalInProcess"></XSL:avec-param> </XSL:appel-modèle> </table> </TD> </TR> </table> </XSL:autrement> </XSL:choisir> </XSL:modèle> <!-- Ce modèle effectue le travail d'affichage des lignes individuelles dans le graphique à barres. Vous ferez probablement la plupart de vos peaufinage ici. --> <XSL:modèle nom="ShowBar"> <XSL:Param nom="BarDisplayLabel" /> <!-- étiquette pour montrer --> <XSL:Param nom="BarPercent"/> <!-- Pourcentage du total. --> <XSL:Param nom="QueryFilterFieldName"/> <!-- Utilisé pour accéder à la requête & filtre --> <XSL:Param nom="QueryFilterFieldValue"/> <!-- Utilisé pour accéder à la requête & filtre --> <XSL:Param nom="TotalItems" /> <!-- nombre total d'appels cette barlabel --> <TR> <!-- La barre de l'étiquette elle-même. --> <TD classe="MS-formbody" Largeur="30%"> <!-- Cette prochaine série de déclarations génère une chaîne de requête qui nous permet d'explorer une vue filtrée des données sous-jacentes. Nous faisons usage de quelques petites choses ici: 1. Nous pouvons passer FilterField1 et FilterValue1 à une liste pour filtrer sur une colonne. 2. SharePoint est en passant un paramètre clé pour nous, ListUrlDir qui pointe vers la liste sous-jacente contre laquelle cette DVWP est « running ». N'est pas amusant XSL? --> <XSL:texte disable-output-escaping="Oui"> <![CDATA[<a href ="]]></XSL:texte> <XSL:de la valeur Sélectionnez="$ListUrlDir"/> <XSL:texte disable-output-escaping="Oui"><![CDATA[?FilterField1 =]]></XSL:texte> <XSL:de la valeur Sélectionnez="$QueryFilterFieldName"/> <XSL:texte disable-output-escaping="Oui"><![CDATA[&FilterValue1 =]]></XSL:texte> <XSL:de la valeur Sélectionnez="$QueryFilterFieldValue"/> <XSL:texte disable-output-escaping="Oui"><![CDATA[">]]></XSL:texte> <XSL:de la valeur Sélectionnez="$BarDisplayLabel"/> <XSL:texte disable-output-escaping="Oui"><![CDATA[</un>]]></XSL:texte> <!-- Le bit suivant montre quelques chiffres au format: "(total / % du total)" --> (<XSL:de la valeur Sélectionnez="$TotalItems"/> / <!-- Cela crée une étiquette de pourcentage sympa pour nous. Merci, Microsoft! --> <XSL:appel-modèle nom="PercentFormat"> <XSL:avec-param nom="pour cent" Sélectionnez="$BarPercent"/> </XSL:appel-modèle>) </TD> <!-- Enfin, émettre un <TD> balise pour la barre elle-même.--> <TD> <table CellPadding="0" CellSpacing="0" frontière="0" Largeur="{tour($BarPercent * 100)+1}%"> <TR bgcolor="rouge"> <XSL:texte disable-output-escaping="Oui"><![CDATA[&nbsp;]]></XSL:texte> </TR> </table> </TD> </TR> </XSL:modèle> <!-- Cela est pris directement à partir de quelques XSL, j'ai trouvé dans un modèle MS. --> <XSL:modèle nom="PercentFormat"> <XSL:Param nom="pour cent"/> <XSL:choisir> <XSL:Lorsque test="format-nombre($pour cent, '#,##0%;-#,##0%')= « NaN »">0%</XSL:Lorsque> <XSL:autrement> <XSL:de la valeur Sélectionnez="format-nombre($pour cent, '#,##0%;-#,##0%')" /> </XSL:autrement> </XSL:choisir> </XSL:modèle> </XSL:feuille de style>

Les résultats:

Le XSL ci-dessus génère ce graphique:

image

Explorer les données sous-jacentes en cliquant sur le code d'État:

image

Pensées finales:

Ceci peut être généralisé?

J'adore ce concept graphique, mais je déteste le fait que j'ai d'aller faire autant-codage à la main. J'ai donné un peu de réflexion pour savoir si elle peut être généralisée et je suis optimiste, mais je suis aussi un peu peur qu'il peut y avoir un mur de briques quelque part le long de la voie qui n'offre aucune solution de contournement. Si quelqu'un a quelques bonnes idées sur ce, Veuillez prendre note dans les commentaires ou Ecrivez-moi.

Graphes verticales:

Il s'agit d'un diagramme à barres horizontales. Il est certainement possible créer un graphique vertical. Nous avons juste besoin de modifier le code HTML. Je voudrais commencer de la même manière: Créer une représentation HTML d'un graphique à barres vertical et puis trouver un moyen d'obtenir que la via XSL. Si quelqu'un est intéressé par ce, Je pourrais être persuadé de l'essayer et travailler sur the kinks. Si quelqu'un a déjà fait, s'il vous plaît laissez-moi savoir et je vais créer un lien avec plaisir sur votre blog 🙂

Je pense que le défi avec un graphique vertical est que les étiquettes du graphique sont plus difficiles à gérer, mais certainement pas impossible.

Du champ nom Gotcha:

Il y a au moins deux choses à regarder dehors pour vos noms de domaine.

Première, un nom de domaine avec un espace doit être échappé dans le XSL. Ce sera probablement une question ici:

        <XSL:variable nom="totalProposed" 
Sélectionnez="comte(/dsQueryResponse/lignes/en rangée[Normalize-space(@Status) = « Proposée »])" />

Si votre statut"" colonne est en fait nommé "Code d'État" ensuite vous devez le référencer comme « Status_x0020_Code »:

   <XSL:variable nom="totalProposed" 
Sélectionnez="comte(/dsQueryResponse/lignes/en rangée[Normalize-space(@Status_x0020_Code) = « Proposée »])" />

Seconde, et je suis un peu floue sur ce, mais il faut aussi être sur le qui-vive pour les changements de nom de domaine. Si vous nommez votre champ "Code d'État" et puis plus tard sur, Renommez-le en « AFE Status », le nom"interne" ne change pas. Le nom interne sera toujours "Code d'État" et doit être référencé comme « Status_x0020_Code ». Les « autres ressources" liens peuvent aider à diagnostiquer et corriger ce genre de problème.

Sur cette couleur:

J'ai choisi "rouge" parce que c'est agréable à moi en ce moment. Il ne serait pas une grosse affaire pour montrer les différentes couleurs afin de fournir plus qu'une description visuelle d'un certain nombre, mais aussi fournir un indicateur de performance clé utile. Par exemple, Si le pourcentage de "calé" L'AFE est > 10% alors montrez-le rouge, dans le cas contraire le montrer en noir. Utilisation <XSL:choisir> pour y parvenir.

Autres ressources:

Transformer heureux!

<fin />

S'abonner à mon blog!

SharePoint ne fournit pas “Qui a accès” Rapports

MISE À JOUR 01/28/08: Ce projet codeplex aborde cette question: http://www.codeplex.com/AccessChecker. Je le n'ai pas utilisé, mais il semble prometteur, il s'agit d'une question, que vous avez besoin de l'adresse dans votre environnement.

MISE À JOUR 11/13/08: Joel Oleson a écrit un très bon poste sur la plus grande sécurité gestion question ici: http://www.sharepointjoel.com/lists/posts/post.aspx?Liste = 0cd1a63d % 2D183c % 2D4fc2 % 2 D 8320 % 2Dba5369008acb&ID = 113. Liens vers un certain nombre d'autres ressources utiles.

Les clients et les utilisateurs du forum demandent souvent une question dans ce sens: "Comment générer une liste de tous les utilisateurs ayant accès à un site" ou "Comment peux j'ai alerter automatiquement tous les utilisateurs ayant accès à la liste sur les modifications apportées à la liste?"

Il n'y a aucune sortie de la solution de la boîte pour cela. Si vous y réfléchissez un instant, Il n'est pas difficile de comprendre pourquoi.

Sécurité de SharePoint est très flexible. Il y a au moins quatre grandes catégories d'utilisateurs:

  • Utilisateurs anonymes.
  • Groupes et des utilisateurs SharePoint.
  • Utilisateurs Active Directory.
  • L'authentification basée sur les formulaires (FBA) utilisateurs.

La flexibilité signifie que dans une perspective de sécurité, n'importe quel site SharePoint donné sera très différent de l'autre. Afin de générer un rapport de liste d'accès, On a besoin déterminer comment le site est sécurisé, interroger plusieurs référentiels de profil utilisateur différent et présentez-le ensuite de manière utile. C'est un problème difficile à résoudre de manière générique.

Comment les organisations sont face à cela? Je serais ravi de vous entendre dans les commentaires ou Messagerie.

</fin>