- Getting Started
-
How to Navigate This Course
-
Discussion Forum
-
Offline Course Videos for Blocked YouTube Users
-
Course Workbook
-
Course Presentation
- Training Cloud Environments
-
Launch Cloud Environment
- Lesson 1 - Overview of this course
-
Introduction (1:29)
-
Environment (1:20)
-
Before we get Started (1:47)
- Lesson 2 - Create and Load Symbol
-
Parts of a PI Vision Symbol (4:05)
-
Creating the Implementation Layer (7:05)
-
Creating the Presentation Layer (1:14)
-
Testing the Symbol (1:53)
-
[EXERCISE] Create and Test Symbol
-
[SOLUTION] Create and Test Symbol
- Lesson 3 - Update Symbol with Data
-
Data Shapes (3:00)
-
[EXERCISE] Define a Data Shape for the Symbol
-
[SOLUTION] Define a Data Shape for the Symbol
-
Data Updates (3:05)
-
Init Callback Functions
-
[EXERCISE] Implement the Data Update Listener Callback Function
-
[SOLUTION] Implement the Data Update Listener Callback Function
-
Working with the DOM (1:00)
-
[EXERCISE] Rotate the Arrow HTML Element Based on Data Updates
-
[SOLUTION] Rotate the Arrow HTML Element Based on Data Updates
- Lesson 4 - Show Value Timestamp and Label
-
Using the Symbol’s Scope (1:18)
-
[EXERCISE] Get Value and Timestamp
-
[SOLUTION] Get Value and Timestamp
-
[EXERCISE] Get Label and Units
-
[SOLUTION] Get Label and Units
-
AngularJS Data Binding (1:31)
-
[EXERCISE] Display Value, Timestamp, Label, and Units
-
[SOLUTION] Display Value, Timestamp, Label, and Units
- Lesson 5 - Create a Configuration Pane
-
Configuration Layer (1:56)
-
[EXERCISE] Create a Configuration Pane
-
[SOLUTION] Create a Configuration Pane
- Lesson 6 - Add Styles to Symbol and Configuration Pane
-
CSS Files (1:24)
-
[EXERCISE] Add Styles to Presentation and Configuration Layer
-
[SOLUTION] Add Styles to Presentation and Configuration Layer
- Course Evaluation
-
How did it go?
- Final Exam
-
Final Exam
PI Vision Extensibility: Creating Custom Symbols
Become familiar with the PI Vision Extensibility Framework; a powerful model that enables you to write custom symbols and tool panes for use in PI Vision displays
This course is designed for developers who are interested in creating custom symbols for PI Vision. The PI Vision Extensibility Framework is a powerful model that enables you to write custom symbols and tool panes for use in PI Vision displays, including unique or industry-specific ways of visualizing PI data. Throughout our exercises, we will learn how to register a symbol, hook into the built-in symbol events, update the symbol’s view, and create a configuration pane.
By the end of the course, you will be able to...
- Describe the file structure of a PI Vision symbol
- Describe the 3 layers that make up a PI Vision symbol
- Describe how a PI Vision symbol retrieves data from the PI Vision server
- Create and register a PI Vision custom symbol
- Hook into the PI Vision symbol data updates and display the data to the user
- Create a configuration pane for your custom symbol.
Audience
This course is best suited for developers or PI System administrators comfortable with web development that would like to extend their existing PI Vision installation to include additional custom symbols.
Level: Intermediate
Study time: 16 hours
Course Access: Unlimited access to all content except the Training Cloud Environment (TCE). You have 30 days access to the TCE starting on the day you access module section "Launch Cloud Environment".
After those 30 days you can purchase additional access with one of the two options below:
Prerequisites
- Comfortable working with web technologies such as HTML, CSS, and JavaScript.
- Basic AngularJS and jQuery knowledge is useful, but not required for completing this course.
- Basic PI Server and PI Vision knowledge is useful, but not required for completing this course.
- A computer that can access our YouTube content.
Software Requirements
- In this course, we will work with the cloud environment (PICLIENT machine) which contains the following components:
- PI Vision 2019 Web Server
- Browser
- VS Code Text Editor
- The environment also currently contains a domain controller and a PI Server, but interaction with these is not required. Students will interact with the PI Server indirectly through the PI Vision web application.
- PDF Reader or equivalent is required to access the workbook and presentation provided.
This Course Includes...
- Videos, discussion opportunities and quizzes to help you learn the material
- A Cloud Environment accessible for 30 days and configured to complete all the exercises in the course
- This course is self-paced for your convenience. Thus, there are no live components to the course, nor are there required login hours. Please use the video lectures for instruction along with the course exercises to gain experience working with the key concepts presented.
- There is a final quiz which you must pass to obtain a certificate of completion.
- Once you register for a course, you will have access to the course materials 24/7 on this website.
Further Information
- This is a self-paced course. Any questions or assistance needed about the material can be asked in this course's space in the OSIsoft PI Square community
- When you complete the examination at the end of the course, you will receive a certificate of completion which can be shared and directly posted on LinkedIn.
- For more information about our Online Courses please visit our FAQ page
Course Materials
- You can audit the full video lecture content right now on the OSIsoft Learning YouTube Channel
- Download Course Workbook