|
||
---|---|---|
.. | ||
.vscode | ||
assets | ||
config | ||
src | ||
teams | ||
typings | ||
.editorconfig | ||
.gitattributes | ||
.npmignore | ||
.yo-rc.json | ||
README.md | ||
gulpfile.js | ||
package-lock.json | ||
package.json | ||
tsconfig.json | ||
tslint.json |
README.md
page_type | products | languages | extensions | |||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
sample |
|
|
|
Modern Charts
Summary
This webpart uses the Chart.js library to visualize SharePoint list data.
Built in Chart Types: -Bar -Horizontal Bar -Doughnut -Line -Pie -Polar -Radar
Each chart is uniquely themed with the built-in color theme generator (color-scheme), continue generating a theme until you find one to your liking.
New charts are populated with Sample data, select a site (or define a custom path with the Other option), a list data source, label column, data column and which column indicates a unique value in your list. See the demo below for an example.
Current Data Functions: -Average -Count -Sum
Media
Working with
Built with SharePoint Framework GA, Office Graph, React and Chart.JS
Used SharePoint Framework Version
Applies to
Solution
Solution | Author(s) |
---|---|
react-modern-charts | Jeremy Coleman (MCP, PC Professional, Inc.) |
react-modern-charts | Peter Paul Kirschner (@petkir_at) |
Version history
Version | Date | Comments |
---|---|---|
1.0.0.3 | July 30, 2020 | Support for Managed Metadata Field(Single) as Label |
1.0.0.2 | February 09, 2020 | Upgrade to SPFx 1.10.0 |
1.0.0.1 | April 25, 2018 | Update to SPFx 1.4.1 |
1.0.0.0 | February 11, 2017 | Initial release |
Disclaimer
THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.
Prerequisites
- SharePoint Online tenant with Office Graph content-enabled
Minimal Path to Awesome
- clone this repo
npm i
gulp serve
- if deploying to Office 365, update the CDN path in write-manifests.json
Features
Sample Web Parts in this solution illustrate the following concepts on top of the SharePoint Framework:
- using React for building SharePoint Framework Client-Side Web Parts
- using Office UI Fabric React components for building user experience consistent with SharePoint and Office
- communicating with SharePoint using its REST API
- passing Web Part properties to React components
- building dynamic web part properties