Spuštění akcí s daty, které obsahují vložený obsah
Podle zde popsaných informací se dozvíte o vkládání a provádění datových akcí ve vizualizaci v rámci externích kontejnerů, jako je stránka HTML nebo webová stránka aplikace.
Poznámka:
Příklady uvedené v této části se vztahují k vloženým akcím s daty, kdy vkládající aplikace nepoužívá technologii Oracle JET. Prostudujte si část:Spouštění akcí s daty
Pokud kliknete na akci s daty Publikovat událost, akce určí kontextové informace vizualizace a předá je službě akce navigace, aby je zpracovala. Proces služby sloužící pro akci navigace vyvolá událost zvanou „oracle.bitech.dataaction“ obsahující informace o datové části kontextu. K této události můžete provést subskripci a při zpětném volání akce získat datovou část a podle potřeby ji dále využít.
Následující vizualizace zobrazuje tržby v dolarech pro obory činnosti, například Komunikace, Digitální zařízení, Elektronika, v organizacích, například Organizace frančíz, Vstupní organizace, Mezinárodní organizace.
Formát a kontext události a datové části
Následující příklad demonstruje publikování události, kdy je vložená akce s daty vyvolána nejméně jednou datovou buňkou, na kterou uživatel klikl pravým tlačítkem a danou akci s daty vybral z nabídky zobrazené ve vloženém sešitu.
Níže uvedené příklady jsou ze souboru JSON, například obitech-cca/cca/component.json.
Formát události
"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"
}
}
}
Formát datové části
{"context":[
"or": [
"and":[
{"contextParamValues":[...],
"contextParamValuesKeys":[...],
"colFormula":"...",
"displayName":"...",
"isDoubleColumn":true/false,
"dataType":"..."
}
]
]
]
}
Předání jedné hodnoty do jednoho sloupce v případě předání podle kontextu
V tomto příkladu je po kliknutí na buňku sloupce objekt s kontextovými informacemi o sloupci předán externímu kontejneru. Zde se tedy předává název organizace.
{
"context": [
{
"contextParamValues": [
"Inbound Org."
],
"contextParamValuesKeys": [
"Inbound Org."
],
"colFormula": "\"A - Sample Sales\".\"Offices\".\"D3 Organization\"",
"displayName": "D3 Organization",
"isDoubleColumn": false,
"dataType": "varchar"
}
]
}Předání jedné hodnoty do každého sloupce v případě předání podle kontextu
V tomto příkladu se při kliknutí na buňku sloupce, například Vstupní organizace a Digitální produkty, přenese při kliknutí na volbu nabídky Vložený DA1 pro výběr vložené akce hodnota tržeb v dolarech pro vybraný obor činnosti a organizaci. Například se přenesou tržby pro Digitální produkty ze Vstupní organizace, v tomto případě tedy 1 458 738,42 USD.
.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"
}
]
}Předání několika hodnot v případě předání podle kontextu
V tomto příkladu se při kliknutí na dvě buňky řádky (například Vstupní organizace a Mezinárodní organizace pro Digitální produkty) a kliknutí na volbu nabídky Vložený DA1 pro výběr vložené akce přenese hodnota tržeb v dolarech pro dvě vybrané buňky organizace a obory činnosti. Například kliknutím na tržby pro Digitální produkty z jedné ze dvou vybraných organizací (Vstupní a Mezinárodní) se přenese hodnota 1 458 738,42 USD a 915 528,97 USD.
.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"
}
]
}
]
}
]
}Tyto kroky použijte ke konfiguraci vzorové stránky HTML zobrazené níže.
-
Přidejte nebo upravte umístění cesty sešitu.
Další informace viz
<======== 1níže. -
Proveďte subskripci publikované události nazvané ‘oracle.bitech.dataaction’.
Další informace viz
<======== 2níže. -
Definujte službu listener události a její zpětné volání.
Další informace viz
<======== 3níže.
Příklad stránky HTML s vizualizací, která přijímá události
Následující stránka HTML obsahuje vloženou vizualizaci a může přijímat události. Stránka HTML je konfigurována tak, aby očekávala událost „oracle.bitech.dataaction“.
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"><html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<title>Standalone DV CCA Demo</title>
<script src="http://hostname:port/bali/ui/api/v1/plugins/embedding/standalone/embedding.js" type="text/javascript"></script>
</head>
<body>
<h1>Standalone DV CCA Embedded Data Action Demo</h1>
<div id="mydiv" style="position: absolute; width: calc(100% - 40px); height: calc(100% - 120px)" >
<oracle-dv project-path="/Shared Folders/RR/sample"></oracle-dv> <=============== 1
</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'; <========== 2
var element = document.getElementById("mydiv");
if (element) {
var oEventListener = element.addEventListener(eventName, function (e) { <================= 3
console.log("***** Payload from DV ***** ");
console.log("eventName = " + e.detail.eventName);
console.log("payload = " + JSON.stringify(e.detail.payload));
console.log("***** Payload from DV end ***** ");
}, true);
}
</script>
</body>
</html>