PeopleSoft Create Chart Graph Example Part 1

Often as a PeopleSoft developer, I had to end up creating charts / graphs for my customers. To create a chart in PeopleSoft (2D graph in this example) you can use the delivered chart API class to construct what you are after. But, I felt the documentation for the API is a bit vague and provide an example for creating a chart through PeopleSoft application. I will also cover some third party approaches for creating beautiful SVG graphs inside PeopleSoft. We will also discuss how to integrate PeopleSoft with gRaphaël—JavaScript Library and create graphs on the fly. I would assume that you have a test page built in PeopleSoft to test your chart. Follow the step by step procedure provided in this tutorial below to create rich looking graphs in PeopleSoft.

1) Sign in to PeopleSoft Application designer using your developer login and password.

2) Open your test page where you want the chart control to be placed. It need not be a test page always. You can even put this on the page you want depending on your requirement.

3) Now, you have to insert a chart control to your page. To do this, Click on "Insert" and select "Chart". You will then be able to draw a chart control on the test page with this option. Draw a chart control and we will be using this control to create graphs for us.

Insert Chart Control From Application Designer

Chart Control Added to a PeopleSoft Page

4) You need to attach the chart control to a record field definition in PeopleSoft. This is mandatory for every chart you create. Later on in the tutorial, you will come to know that the chart object you create through PeopleCode will refer to this record field definition. To associate the chart control to a record field definition, double click on the chart control and select your record / field name. It can be a work record also.

Attaching Chart to a Record Field Definition

 5) We are now ready to write some PeopleCode for the chart object. I will be writing it in the Page Activate event. But, you can write it anywhere depending on your requirement.

Refer to part 2 of this tutorial for PeopleCode to Create a Chart in PeopleSoft.