ביצוע פעולות נתונים שמכילות תוכן משובץ

עקוב אחר המידע המתואר כאן כדי ללמוד על שיבוץ וביצוע של פעולות נתונים בהמחשה גרפית בתוך אובייקטים מכילים חיצוניים כגון דף HTML או דף יישום.

הערה :

הדוגמאות בפרק זה חלות על פעולות על נתונים משובצים כאשר היישום המשבץ לא משתמש בטכנולוגיה של Oracle JET. ראה:

ביצוע פעולות נתונים

כשלוחצים על פעולת נתונים 'פרסם אירוע', הפעולה קובעת את מידע ההקשר להמחשה הגרפית ומעבירה את המידע לשירות פעולת הניווט כדי לעבד אותו. תהליך השירות של פעולת הניווט מפעיל אירוע שנקרא “oracle.bitech.dataaction” עם מידע המסר של ההקשר. תוכל להצטרף כמנוי לאירוע זה ולקבל את המסר ב-callback של האירוע, ותוכל גם לעשות שימוש נוסף במסר לפי הצורך.

ההמחשה הגרפית הבאה מציגה את ההכנסות בדולרים בשביל תחומי פעילות עסקית, למשל תקשורת, דיגיטל, אלקטרוניקה, בין ארגונים, למשל ארגון זכיונות, ארגון נכנס, ארגון בינלאומי.

להלן תיאור של GUID-B6F00C33-0D8C-4AB2-B8F5-59E8D12E4B30-default.gif
.gif

פורמט והקשר של אירוע ומסר

הדוגמא הבאה מדגימה פרסום של אירוע לאחר שפעולת הנתונים המשובצים הופעלה באמצעות תא אחד או יותר שלחצו עליהם לחיצה ימנית ובחרו פעולות נתונים מהתפריט המוצג בחוברת העבודה המשובצת.

הדוגמאות להלן הן מקובץ JSON ,לדוגמה, obitech-cca/cca/component.json.

פורמט אירוע

"events": {
   "oracle.bitech.dataaction": {
      "description": "Generic DV Event published from an embedded data visualization.",
      "bubbles": true,
      "cancelable": false,
      "detail": {
         "eventName": {
         "description": "The name of the published BI Event",
         "type": "string"
      },
      "payload": {
         "description": "The payload contains context and related information to the event published",
         "type": "object"
      }
   }
}

פורמט מסר

{"context":[
   "or": [
      "and":[
         {"contextParamValues":[...],
          "contextParamValuesKeys":[...],
          "colFormula":"...",
          "displayName":"...",
          "isDoubleColumn":true/false,
          "dataType":"..."
         }
      ]
   ]
 ]
}

העברת ערך בודד לעמודה יחידה ב'העבר לפי הקשר'

בדוגמה זו, כאשר אתה לוחץ על תא עמודה, האובייקט עם המידע ההקשרי על העמודה מועבר לאובייקט המכיל החיצוני. במקרה זה, מועבר שם הארגון.

{
   "context": [
      {
         "contextParamValues": [
            "Inbound Org."
         ],
         "contextParamValuesKeys": [
            "Inbound Org."
         ],
         "colFormula": "\"A - Sample Sales\".\"Offices\".\"D3  Organization\"",
         "displayName": "D3  Organization",
         "isDoubleColumn": false,
         "dataType": "varchar"
      }
   ]
}

העברת ערך בודד לכל עמודה ב'העבר לפי הקשר'

בדוגמה זו, כאשר תלחץ על תא בעמודה ,לדוגמה, ארגון פנימי עם מוצרים דיגיטליים, ותלחץ על אפשרות התפריט DA1 משובץ כדי לבחור את הפעולה המשובצת, המידע שיועבר הוא ערך ההכנסה בדולרים של הארגון והתחום העסקי שנבחרו. לדוגמה, ההכנסה שהועברה ממוצרים דיגיטליים בארגון המקומי היא $1, 458,738.42 בדוגמה זו.

להלן תיאור של GUID-277630C2-D839-48E9-B965-333BE8D9D7DF-default.gif
.gif
{
   "context": [
      {
         "contextParamValues": [
            "Digital"
         ],
         "contextParamValuesKeys": [
            "Digital"
         ],
         "colFormula": "\"A - Sample Sales\".\"Products\".\"P3  LOB\"",
         "displayName": "P3  LOB",
         "isDoubleColumn": false,
         "dataType": "varchar"
      },
      {
         "contextParamValues": [
            "Inbound Org."
         ],
         "contextParamValuesKeys": [
            "Inbound Org."
         ],
         "colFormula": "\"A - Sample Sales\".\"Offices\".\"D3  Organization\"",
         "displayName": "D3  Organization",
         "isDoubleColumn": false,
         "dataType": "varchar"
      }
   ]
}

העברת ערכים מרובים ב'העבר לפי הקשר'

בדוגמה זו, כאשר תלחץ על שני תאי שורה (לדוגמה, ארגון פנימי וארגון בינלאומי של מוצרים דיגיטליים) ותלחץ על אפשרות התפריט DA1 משובץ כדי לבחור את הפעולה המשובצת, המידע שיועבר הוא ערך ההכנסה בדולרים של שני התאים שנבחרו לארגון ולתחומים עסקיים. לדוגמה, לחיצה על הכנסה של מוצרים דיגיטליים משני הארגונים שנבחרו (ארגון מקומי וארגון בינלאומי) מעבירה את הערכים $1, 458,738.42, וגם $915,528.97.

להלן תיאור של GUID-FB843F63-4CDC-41E5-A1D6-B640A73981E9-default.gif
.gif
{
   "context": [
      {
         "or": [
            {
               "and": [
                  {
                     "contextParamValues": [
                        "Digital"
                     ],
                     "contextParamValuesKeys": [
                        "Digital"
                     ],
                     "colFormula": "\"A - Sample Sales\".\"Products\".\"P3  LOB\"",
                     "displayName": "P3  LOB",
                     "isDoubleColumn": false,
                     "dataType": "varchar"
                  },
                  {
                     "contextParamValues": [
                        "Inbound Org."
                     ],
                     "contextParamValuesKeys": [
                        "Inbound Org."
                     ],
                     "colFormula": "\"A - Sample Sales\".\"Offices\".\"D3  Organization\"",
                     "displayName": "D3  Organization",
                     "isDoubleColumn": false,
                     "dataType": "varchar"
                  }
               ]
            },
            {
               "and": [
                  {
                     "contextParamValues": [
                        "Digital"
                     ],
                     "contextParamValuesKeys": [
                        "Digital"
                     ],
                     "colFormula": "\"A - Sample Sales\".\"Products\".\"P3  LOB\"",
                     "displayName": "P3  LOB",
                     "isDoubleColumn": false,
                     "dataType": "varchar"
                  },
                  {
                     "contextParamValues": [
                        "International Org."
                     ],
                     "contextParamValuesKeys": [
                        "International Org."
                     ],
                     "colFormula": "\"A - Sample Sales\".\"Offices\".\"D3  Organization\"",
                     "displayName": "D3  Organization",
                     "isDoubleColumn": false,
                     "dataType": "varchar"
                  }
               ]
            }
         ]
      }
   ]
}

השתמש בשלבים אלו כדי להציג מסרי אירועים באמצעות כלי דפדפן Chrome.

  1. ב-Chrome, לחץ לחיצה ימנית ובחר בדוק מקור.
  2. בכרטיסייה מקורות, לחץ באמצעות לחצן העכבר הימני על השורה console.log("כדי להציג את המסר, הוסף נקודת עצירה בשורה זו והשתמש במנפה הבאגים של כלי הדפדפן") ; ובחר הוסף נקודת עצירה.

    כאשר פעולת נתוני האירוע מופעלת מהיריעה המשובצת, ערך מסר יופיע בפרק היקף בחלונית הימנית של כלי הדפדפן.

  3. לחץ לחיצה ימנית על ערך המסר ובחר אחסן כמשתנה גלובלי.

    ניתן לראות את המשתנה הגלובלי בכרטיסייה קונסולה ולהרחיב אותו כדי להציג פרטים של המסר.

דוגמה לדף HTML עם המחשה גרפית, שמקבל אירועים

הקוד לדוגמה הבא ממחיש כיצד להגדיר listener של אירוע לפעולת נתוני אירוע analytics. עליך לעדכן את מופע הניתוח ואת הנתיב המשובץ לחוברת העבודה בדגימת קוד זו. לחוברת העבודה חייבת להיות מוגדרת פעולת נתוני אירוע. האירוע שמאזינים לו נקרא oracle.bitech.dataaction. כאשר האירוע מופעל, נשלחת הודעה לקונסולה.

<!DOCTYPE HTML>
<html dir="ltr">
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <title>Oracle Analytics embed example to view data action event payload</title>
      <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
      <script src="https://<OAC-INSTANCE>.analytics.ocp.oraclecloud.com/public/dv/v1/embedding/standalone/embedding.js" type="application/javascript">
      </script>

   </head>
   <body>
      <h1>Oracle Analytics embed example to view data action event payload</h1>

      <div id="mydiv" style="position: absolute; width: calc(100% - 40px); height: calc(100% - 120px)" >
         <oracle-dv project-path='<WORKBOOK-PATH-TO-EMBED>'
          active-page='insight'
          active-tab-id='snapshot!canvas!1'>
         </oracle-dv>
      </div>

      <script>
         requirejs(['knockout', 'ojs/ojcore', 'ojs/ojknockout', 'ojs/ojcomposite', 'jet-composites/oracle-dv/loader'], function(ko) {
          ko.applyBindings();
         });

      </script>
      <script>
         var eventName = 'oracle.bitech.dataaction';
         var element = document.getElementById("mydiv");
         if (element) {
         var oEventListener = element.addEventListener(eventName, function (e) {
         console.log("***** Payload from DV sent ***** ");
         console.log("eventName = " + e.detail.eventName);
         console.log("To view the payload, add a breakpoint on this line and use the browser tools debugger") ;
         console.log("******************************** ");
         }, true);
         }
      </script>
   </body>
</html>

אתה יכול גם לשנות את הפרק <script> בדגימת הקוד הקודמת כדי להחזיר את הערכים של המקום שבו הופעלה פעולת הנתונים:

<script>
         var eventName = 'oracle.bitech.dataaction';
         var element = document.getElementById("mydiv");
         if (element) {
         var oEventListener = element.addEventListener(eventName, function (e) {
         console.log("***** Payload from DV sent ***** ");
         console.log("eventName = " + e.detail.eventName);
         console.log("To view the payload, add a breakpoint on this line and use the browser tools debugger") ;
         console.log("******************************** ");

         var res = " Data Received from DV Content:    ";

       // Get the values of the row from where data action was invoked
           Object.keys(e.detail.payload.context).forEach(function(key) {
            res = res.concat(key);
            res = res.concat(" : ");
            var temp = e.detail.payload.context[key]["oValueMap"];
            var temp1 = Object.keys(temp)[0];
            res = res.concat(temp1);
            res = res.concat(" | ");
           });

          console.log("Data Action Row Context : " + res);

         }, true);
         }
      </script>