14 Replies Latest reply on Dec 10, 2018 7:10 PM by taterhead247

    Inserting Google Analytics into PI Vision

    taterhead247

      Does anyone have experience inserting Google Analytics into PI Vision code?  We have a fairly well established Google Analytics account in our company, but we can't figure out where to insert the necessary code in the Vision directory in order to make it work.  We approached OSI for help, but they are very reluctant to help us "jailbreak" Vision.  We have a development environment so we'd be able to play around with it a bit.  Any clues would help.

       

      Lonnie Bowling , I was told you were an expert in this field?  And might be able to help?

        • Re: Inserting Google Analytics into PI Vision
          Lal_Babu_Shaik

          Hi Damon

           

          PI Vision extensibility feature will be useful to implement the same.  Please refer @Marcos Vainer Loeff blog for additional information Developing the Google Maps custom symbol for PI Vision 3 - Part 1

          1 of 1 people found this helpful
          • Re: Inserting Google Analytics into PI Vision
            KenjiHashimoto

            If you want to show the other web page on the PI Vision, then frame can be used.

            There are example custom symbols from OSIsoft on the GitHub.

            GitHub - osisoft/PI-Vision-Custom-Symbols: Learn how to add a custom symbol, created with JavaScript and HTML, to PI Vis…

            There is a embed webpage custom symbol and I hope it can show Google Analytics page.

            PI-Vision-Custom-Symbols/Community Samples/OSIsoft/embedWebPage at master · osisoft/PI-Vision-Custom-Symbols · GitHub

            If you search some item and put this symbol, then you can see webpage on PI Vision as a frame.

            Right click and format can set the web page address.

            The remaining things are

            1 Some of the web site does not allow flame. I have not checked it by myself.

            2 Google analytics page require authentication.

             

            Please try above embed webpage custom symbol and let us know the results.

            • Re: Inserting Google Analytics into PI Vision
              Marcos Vainer Loeff

              Hi Damon,

               

              Yes, it should be possible. You need to create a file on the PI Vision ext folder (the folder for PI Vision custom symbols). Although you won't be creating a custom symbol in this case, you need to put the file in this folder so PI Vision can load it. All files from this folder is loaded by default. The next step is to load Google Analytics script dynamically. Here is an example of JavaScript code:

               

              var xhrObj = new XMLHttpRequest();
              xhrObj.open('GET', "/PIVision/Scripts/app/editor/symbols/ext/libraries/angular-piwebapi-kerberos.min.js", false);
              xhrObj.send('');
              var se = document.createElement('script');
              se.type = "text/javascript";
              se.text = xhrObj.responseText;
              document.getElementsByTagName('head')[0].appendChild(se);
              

               

              You might need to change something besides the URL of the script file. I haven't tested it with Google Analytics.

               

              Hope this helps!

              1 of 1 people found this helpful
              • Re: Inserting Google Analytics into PI Vision
                ssauder

                Hi Damon,

                This article from Microsoft looks promising. Have you seen it yet?

                 

                Sample: Web Analytics Tracking Module | Microsoft Docs

                 

                I will hopefully have a chance to try it out tomorrow. If it is compatible, this solution would have the extra benefit of not requiring any PI Vision code to be touched.

                1 of 1 people found this helpful
                  • Re: Inserting Google Analytics into PI Vision
                    ssauder

                    I have an update. After following the steps in the article, I was able to successfully track PI Vision with Google Analytics. The only problem I had was I believe there is a typo in this line:

                     

                    <section name="webAnalytics" overrideModeDefault="Allow">

                     

                    I had to modify it to be:

                     

                    <section name="webAnalytics" overrideModeDefault="Allow" />

                    1 of 1 people found this helpful
                  • Re: Inserting Google Analytics into PI Vision
                    taterhead247

                    Seth Sauder, thanks for following up.  A few things:

                    • For the life of me, I can't figure out how to get gacutil, which is a requirement of the IIS approach
                    • Unless I'm reading the instructions wrong (which is more than likely) you have to add some code to the Vision web.config file.  I feel like that would be unsupported by OSI?
                    • Bryan Klosiewicz forwarded me some snapshots you sent him.  Similar to you we are having trouble getting Google Analytics to send us truly meaningful data.  All traffic comes in as \PIVision\.  We see no display level activity.
                      • And, I think Google Analytics is reading users as maybe an AD group or the service account that runs Vision?  If I go on Google analytics it says there are one or two (at the most) people looking at the website, but if I go into Network Manager Statistics in SMT I can see a large number of people connected to the w3wp.exe process.

                    Right now we are pursuing the Extensibility approach that Marcos Vainer Loeff suggested:

                    • We added a file called GoogleAnalytics.js to D:\Program Files\PIPC\PIVision\Scripts\app\editor\symbols\ext
                    • The GoogleAnalytics.js file has the code below
                    • The only issue is that this is a symbol, which isn't loaded until a display is loaded, which means we get no traffic data on the home page.
                    var se = document.createElement('script');  
                    se.type = "text/javascript";  
                    se.text = "(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-#######');";  
                    document.getElementsByTagName('head')[0].appendChild(se);
                    
                    
                    var ne = document.createElement('noscript');
                    var ie = document.createElement('iframe');
                    ie.src = "https://www.googletagmanager.com/ns.html?id=GTM-#######";
                    ie.height = "0";
                    ie.width = "0";
                    ie.style = "display:none;visibility:hidd
                    ne.appendChild(ie);
                    document.getElementsByTagName('body')[0].appendChild(ne);
                    
                      • Re: Inserting Google Analytics into PI Vision
                        Marcos Vainer Loeff

                        Hello Damon,

                         

                        The other option is to edit the Index.html file located on the %PIHOME64%\PIVision\Views\Home folder by adding a reference to analytics.js just below "@Scripts.Render("~/bundles/libraries/jstz")". Please refer to the code below:

                         

                            @Scripts.Render("~/bundles/libraries/jquery")      
                            @Scripts.Render("~/bundles/jqueryui")      
                            @Scripts.Render("~/bundles/jqueryui/layout")  
                            @Scripts.Render("~/bundles/jquery-ui-patch")  
                            @Scripts.Render("~/bundles/libraries/hammer")  
                            @Scripts.Render("~/bundles/libraries/angular")  
                            @Scripts.Render("~/bundles/libraries/angular-gridster")  
                            @Scripts.Render("~/bundles/libraries/jstz")  
                        
                        
                            <script async src='https://www.google-analytics.com/analytics.js'></script>
                          
                          
                            @Scripts.Render("~/bundles/kendo-patch") 
                        

                         

                        In this case, Google Analytics won't work after updating PI Vision to any version.

                         

                        In the previous case, Google Analytics won't work after updating to PI Vision 4 (2018) which is developed on top of Angular 5. Therefore, if you are using PI Vision 2017 R2, any update will break GA.

                         

                        Hope this helps!

                        • Re: Inserting Google Analytics into PI Vision
                          ssauder

                          Hi Damon,

                          I also had not worked with gacutil before so that part required some Googling on the web. After installing Microsoft SDK, I found the utility in Program Files (x86)\Microsoft SDKs\Windows\v8.1A\bin\NETFX 4.5.1 Tools.

                           

                          Due to how IIS config inheritance works, editing the PI Vision web.config file is not required. Instead I added that line at the website level. Since I was using the Default Website, this was in C:\inetpub\wwwroot\web.config.

                           

                          Yes, you are not going to see any displays names or numbers in the URLs. This is expected since the part of the URL that is after the # character is not sent to the web server. PI Vision is a single-page application, and this portion of the URL is used for "client side routing", meaning that changes this portion of the URL do not correspond to actual HTTP requests made to the web server at that path.

                           

                          The messages I were forwarded and this thread were very specifically asking about Google Analytics. However based on the previous point, I do not know if Google Analytics will really provide what you need. Can you please explain the end goal you are trying to accomplish?

                           

                          I do not have any previous experience with Google Analytics but I can comment on the SMT Network Manager Statistics behavior. All the users that have connected to PI Vision since the last time the application pool was recycled will appear in that list. It does not mean they are necessarily using PI Vision at the moment. I expect that may account for the difference you are observing.

                            • Re: Inserting Google Analytics into PI Vision
                              LuanSandes

                              Hi everyone,

                               

                              I'm interested in using Google Analytics with PI Vision as well.

                              My main goals are:

                                   1. Track which users are using PI Vision displays;

                                   2. Track which displays are being used the most/least;

                                   3. Track how much time users spend on displays;

                               

                              Bonus:

                                   4. From which device are users using PI Vision?

                                   5. How are users navigating through displays? Ex. From display1, user X hyperlinked to display2 and then back to display1 before session was over.

                               

                              We're making a lot of effort to develop and distribute hundreds of standardized displays across several producing areas. Reaching these goals would be the best way to determine user engagement and, therefore, success of the project.

                                • Re: Inserting Google Analytics into PI Vision
                                  ssauder

                                  Based on my brief testing with Google Analytics, here are my comments:

                                   

                                  1. Google Analytics is very good for tracking the number of users but it doesn't record specific users.

                                   

                                   

                                  2. I don't think Google Analytics is effective for tracking specific display usage either. This is because the display name/id are part of the URL fragment and are not actually sent to the web server. The URL fragment is everything after the # character e.g. pivisionserver/PIVision/#/Displays/132636/sinusoid-trend. This results in a report that is not very helpful.

                                   

                                   

                                  3. I see it tracking session duration but I again as far as I can tell there would be no way to connect it back to a specific display.

                                   

                                  4. Google Analytics tracks sessions by device type.

                                   

                                   

                                  You could potentially fill in some of the other information of interest by reporting on table UserDisplayData in the PI Vision SQL database. A row is added there for every unique combination of a user and a display they accessed. The LastAccessed column is updated each time a user opens the same display again.

                                   

                                  1 of 1 people found this helpful
                            • Re: Inserting Google Analytics into PI Vision
                              taterhead247

                              I found this SQL query in another post somewhere.  It's not Google Analytics, but it is reasonably useful.  We were even able to query the Vision data from Power BI and create some displays to slice through the data.

                               

                              You just have to keep in mind that each person/display combo occurs only once.  That means if a display has 50 counts, that means that 50 different people viewed it.  But you don't know if 1 person viewed it 1000 times or 1 time.  And you don't get duration.

                               

                              *As far as Google Analytics and virtual pages (everything after the #) goes.  I talked with a contractor who is supposedly recommended by Google for their work in Analytics.  According to them, you can make GA work with virtual pages, but you have to do some workarounds.  My company didn't feel like paying for their time.  But if anyone else is interested, you can talk to them about it (Bounteous: Creating Big-Picture Digital Solutions - They used to be Lunametrics but just got bought by Bounteous).

                               

                              SELECT VDL.[Name] As Display, UDD.[User], UDD.[LastAccessed]

                                FROM PIVision.dbo.UserDisplayData UDD

                                JOIN PIVision.dbo.View_DisplayList VDL ON UDD.DisplayID = VDL.DisplayID

                               

                              1 of 1 people found this helpful