-
Notifications
You must be signed in to change notification settings - Fork 31
Replace Visualization
ytzlax edited this page Aug 20, 2017
·
6 revisions
This functionality create new visualization and replace it with other visualization. This functionality is like "add dashboard" beside one parameter,"prevoiusVisId", this parameter say to the plugin which visualization to replace;
//Define visualization object
//Set visualiztion ID
let visPartial = {id: "bytes"};
//Set isFullState to false meaning: the programmer pass minimal defenetion attributes
visPartial["isFullState"] = false;
//Set the elasticsearch index where the data store
visPartial["visIndex"] = "logstash-*";
//Set minimal attributes of the visualization, in this example, create pie visualization on the field bytes
visPartial["visState"] = {visType: 'pie', field: 'bytes'};
//Replace visualization with id=memory with the new visualization
visPartial["prevoiusVisId"] = "memory";
in javascript use:
var iWindow=iframe.contentWindow
in typescript use:
var iWindow = (<HTMLIFrameElement>iframe).contentWindow;
iWindow.postMessage({actionType: "setVisualization", visDefenetion: [visPartial]}, '*');
let visDefenetion = {id: "tags"}
visDefenetion["isFullState"] = true;
//Define full state visualization, set visState to well formed visualization state
visDefenetion["visState"] = {
"title": "tags",
"type": "tagcloud",
"params": {
"scale": "linear",
"orientation": "single",
"minFontSize": 18,
"maxFontSize": 72
},
"aggs": [
{
"id": "1",
"enabled": true,
"type": "count",
"schema": "metric",
"params": {}
},
{
"id": "2",
"enabled": true,
"type": "terms",
"schema": "segment",
"params": {
"field": "@tags.raw",
"size": 5,
"order": "desc",
"orderBy": "1"
}
}
],
"listeners": {}
};
visDefenetion["visIndex"] = "logstash-*";
visDefenetion["prevoiusVisId"] = "number_of_cars";
in javascript use:
var iWindow=iframe.contentWindow
in typescript use:
var iWindow = (<HTMLIFrameElement>iframe).contentWindow;
iWindow.postMessage({actionType: "setVisualization", visDefenetion: [visDefenetion]}, '*');