Overview
This Component Plug-in provides the capability to display interactive charts in Appian using Google Charts. It offers support for the following types of charts:
Key Features & Functionality
These charts work on all Appian user interfaces and with the Appian mobile application. They are easy to configure and a sample application is provided as part of the download. The plug-in can be used to set up to provide interactive charts with drill-down capabilities and allow the event context to pass into any SAIL component(s) on the same or a different interface.
How to use the component:
2019 AppMarket Award Winner - Best Use of the Integration SDK
Hi,
Would there be any possibility of using this plugin without needing internet access?
Thanks
Hi
We are using Google Combo Chart Plugin.
Requirement:
Implemented:
Blockers:
1. How to show the y Axis on the Right-Side with Percentage -(Line Cart with Percentage)
2.How to show the numbers inside the circle
3.How to show the numbers inside the Bar Chart in this component --(Appian Out of the Reports has Show legends options to show the numbers inside the Bar Chart.)
4. Upon Selection of Particular Bar chart, how we get to know what column value, we are selecting in order to filter & get the data in a grid format for the selected item.
Thank You In Advance.
Do we have option to store this pdf or png images in to appian folders ?
How to get the selected chart component details?
Is onSelection, getSelection and setSelection of any use to get the selected chart component in combo charts?
Is yes, Can you help me with the syntax of onSelection & getSelection & setSelection
Hi Jose H.
Can you please tell how to write onSelection to get the selected row and column index/value in ComboChart?
In this example, how were you able to vertically align the Shopping Cart Active" node with the "Order Submitted" node?
As shown below screenshot we need to display Week Calendar with Meeting conflicts., without bothering about dates., only time is considered here.
Input data sets are column data (9 am to 6 pm) row data : meeting requests.
Can we achieve below requirement using google calendar/Timeliness?, we just wanted to display only time, no dates attached to it.
Note: below screen designed in out of box features , doens't seems to be working as expected.
Here is code tried with google calender doesn't seems to be working, start and end time , seems to be expecting date format. ,
any alternate suggestion/thoughts would be appreciated.
googleTimelineChartField( chartColumnData: { { type: "string", id: "Name", rowDataKey: "name" }, { type: "string", id: "Title", rowDataKey: "title" }, { type: "string", id: "style", rowDataKey: "style", role: "style" }, { type: "date", id: "Start Time", rowDataKey: "start" }, { type: "date", id: "End Time", rowDataKey: "end" } }, chartRowData: { { name: "Monday", start: time(11,30,0) , end: time( 12, 30, 00 ), title: "Meeiing 1",
},
{ name: "Tuesday", start: time( 09, 00, 00 ), end: time( 09, 30, 00 ), title: "Meeting 2",
}, { name: "Tuesday", start: time( 14, 00, 00 ), end: time( 15, 00, 00 ), title: "Meeting 3",
}, chartOptions: { height: 380 })
Thanks in advance.
Hi,Will this plug-in run in a 'air-tight' installation, meaning the Appian on-premise environment has no access to the Internet?Thanks
a!localVariables( local!download: false, { a!columnsLayout( columns: { a!columnLayout( contents: { googleBubbleChartField( label: "Pie Chart", labelPosition: "ADJACENT", chartColumnData: { { type: "string", id: "ID", rowDataKey: "id" }, { type: "number", id: "Life Expectancy", rowDataKey: "lifeExpectancy" }, { type: "number", id: "Fertility Rate", rowDataKey: "fertilityRate" }, { type: "string", id: "Region", rowDataKey: "region" }, { type: "number", id: "Population", rowDataKey: "population" } }, chartRowData: { { id: "CAN", lifeExpectancy: 80.66, fertilityRate: 1.67, region: "North America", population: 33739900 }, { id: "DEU", lifeExpectancy: 79.84, fertilityRate: 1.36, region: "Europe", population: 81902307 }, { id: "DNK", lifeExpectancy: 78.6, fertilityRate: 1.84, region: "Europe", population: 5523095 }, }, chartOptions: { hAxis: { title: "Life Expectancy" }, vAxis: { title: "Fertility Rate" }, bubble: { textStyle: { fontSize: 12, fontName: "Times-Roman", color: "green", bold: true, italic: true } } }, exportChartType: "PDF", exportChartValue: local!download, exportChartSaveInto: local!download ), googleBubbleChartField( label: "Pie Chart", labelPosition: "ADJACENT", chartColumnData: { { type: "string", id: "ID", rowDataKey: "id" }, { type: "number", id: "Life Expectancy", rowDataKey: "lifeExpectancy" }, { type: "number", id: "Fertility Rate", rowDataKey: "fertilityRate" }, { type: "string", id: "Region", rowDataKey: "region" }, { type: "number", id: "Population", rowDataKey: "population" } }, chartRowData: { { id: "CAN", lifeExpectancy: 80.66, fertilityRate: 1.67, region: "North America", population: 33739900 }, { id: "DEU", lifeExpectancy: 79.84, fertilityRate: 1.36, region: "Europe", population: 81902307 }, { id: "DNK", lifeExpectancy: 78.6, fertilityRate: 1.84, region: "Europe", population: 5523095 }, }, chartOptions: { hAxis: { title: "Life Expectancy" }, vAxis: { title: "Fertility Rate" }, bubble: { textStyle: { fontSize: 12, fontName: "Times-Roman", color: "green", bold: true, italic: true } } }, exportChartType: "PDF", exportChartValue: local!download, exportChartSaveInto: local!download ), } ) } ), a!buttonLayout( primaryButtons: { a!buttonWidget( label: "download", submit: true(), saveInto: { a!save(local!download, true()), } ) } ), })
how can i download multiple charts in single image , there is any solution