Fixed spelling mistake in code and updated README

This commit is contained in:
Hugo Bernier 2020-08-25 23:57:18 -04:00
parent 821ccc0eb1
commit 0b59018b8a
3 changed files with 20358 additions and 166 deletions

View File

@ -1,11 +1,15 @@
# Cascading managed metadata using Graph API (beta) # Cascading managed metadata using Graph API (beta)
## Summary
This web part shows how to use the Microsoft Graph APIs (beta) for Taxonomy to get the data. This web part shows how to use the Microsoft Graph APIs (beta) for Taxonomy to get the data.
### Functionality ### Functionality
![Cascading managed metadata](./assets/cmmd.gif) ![Cascading managed metadata](./assets/cmmd.gif)
### Termstore ### Termstore
![Term store](./assets/termstore.png) ![Term store](./assets/termstore.png)
## Used SharePoint Framework Version ## Used SharePoint Framework Version
@ -17,6 +21,13 @@ This webpart shows how to use the Microsoft Graph APIs (beta) for Taxonomy to ge
* [SharePoint Framework Developer](https://docs.microsoft.com/sharepoint/dev/spfx/sharepoint-framework-overview) * [SharePoint Framework Developer](https://docs.microsoft.com/sharepoint/dev/spfx/sharepoint-framework-overview)
* [Office 365 developer tenant](https://docs.microsoft.com/sharepoint/dev/spfx/set-up-your-developer-tenant) * [Office 365 developer tenant](https://docs.microsoft.com/sharepoint/dev/spfx/set-up-your-developer-tenant)
## Pre-requisites
* Set up the termset structure as shown in the image above.
* For the cities, get the required latitude and longitude.
* Set the description of the city term as `latitude;longitude` (as highlighted for the term `London` in the image above).
## Solution ## Solution
Solution|Author(s) Solution|Author(s)
@ -35,6 +46,13 @@ Version|Date|Comments
--- ---
## Minimal Path to Awesome
* Clone this repository
* in the command line run:
* `npm install`
* `gulp serve`
## Features ## Features
This sample illustrates the following concepts on top of the SharePoint Framework: This sample illustrates the following concepts on top of the SharePoint Framework:
@ -46,28 +64,9 @@ This sample illustrates the following concepts on top of the SharePoint Framewor
* Usage of PnP SPFx controls (Maps and Placeholder) * Usage of PnP SPFx controls (Maps and Placeholder)
* Office UI fabric components * Office UI fabric components
## Config ### Enhancements
* Set up the termset structure as shown in the image above. * Currently, this web part supports 2-level cascading. So there is scope to enhance this such that it supports more levels of cascading dynamically.
* For the cities, get the required latitude and longitude.
* Set the description of the city term as `latitude;longitude` (as highlighted for teh term `London` in the image above).
## Enhancements
* Currently, this webpart supports 2 level cascading. So there is scope to enhance this such that it supports more levels of cascading dynamically.
* Currently, this web part reads latitude and longitude from description of the city terms. If there is a way of getting these from the custom properties of the city terms, then that needs to be implemented. * Currently, this web part reads latitude and longitude from description of the city terms. If there is a way of getting these from the custom properties of the city terms, then that needs to be implemented.
### Building the code <img src="https://telemetry.sharepointpnp.com/sp-dev-fx-webparts/samples/react-graph-cascading-managed-metadata" />
```bash
git clone the repo
npm i
npm i -g gulp
gulp
```
This package produces the following:
* lib/* - intermediate-stage commonjs build artifacts
* dist/* - the bundled script, along with other resources
* deploy/* - all resources which should be uploaded to a CDN.

File diff suppressed because it is too large Load Diff

View File

@ -44,7 +44,7 @@ export default class CascadingManagedMetadataWebPart extends BaseClientSideWebPa
iconName: 'Edit', iconName: 'Edit',
iconText: 'Configure your webpart', iconText: 'Configure your webpart',
description: 'Please configure the web part.', description: 'Please configure the web part.',
buttonLabel: 'Confifure', buttonLabel: 'Configure',
onConfigure: this._onConfigure.bind(this) onConfigure: this._onConfigure.bind(this)
} }
); );