Chart
Chart
controlType chart dataBase'den çekilen verilerin grafik oluşturması için kullanılır.
Record İçinde Kullanımı:
{
"controlType": "chart",
"chartjsConfig": {
"type": "bar",
"script": "",
"data": {
"labels": "$any{GROUPNAME}",
"datasets": [
{
"label": "Res ",
"stack": "b",
"borderColor": "#80d8ff",
"backgroundColor": "#9bffc0",
"datalabels": {
"textAlign": "center",
"color": "#000",
"align": "center",
"anchor": "center"
},
"data": "$any{RESCOUNT}"
},
{
"label": "Res-LY ",
"stack": "bb",
"borderColor": "#80d8ff",
"backgroundColor": "#9bffa0",
"datalabels": {
"textAlign": "center",
"color": "#000",
"align": "center",
"anchor": "center"
},
"data": "$any{typeof RESCOUNT_LY !== 'undefined' ? RESCOUNT_LY : []}"
},
{
"label": "RoomNight",
"stack": "a",
"borderColor": "#ef524f",
"backgroundColor": "#ef524faa",
"datalabels": {
"textAlign": "center",
"color": "#000",
"align": "center",
"anchor": "center"
},
"data": "$any{ROOMCOUNT}"
},
{
"label": "RoomNight-LY",
"stack": "aa",
"borderColor": "#ef524f",
"backgroundColor": "#ef524fa0",
"datalabels": {
"textAlign": "center",
"color": "#000",
"align": "center",
"anchor": "center"
},
"data": "$any{typeof ROOMCOUNT_LY !== 'undefined' ? RESCOUNT_LY : []}"
},
{
"label": "BedNight",
"stack": "c",
"borderColor": "#f3d411",
"backgroundColor": "#f3d411aa",
"datalabels": {
"color": "#000",
"align": "top",
"anchor": "end"
},
"data": "$any{ADULT}",
"hidden": false
},
{
"label": "BedNight-LY",
"stack": "cc",
"borderColor": "#f3d411",
"backgroundColor": "#f3d411a0",
"datalabels": {
"color": "#000",
"align": "top",
"anchor": "end"
},
"data": "$any{typeof ADULT_LY !== 'undefined' ? RESCOUNT_LY : []}",
"hidden": false
},
{
"label": "Revenue",
"stack": "d",
"yAxisID": "right-axis",
"borderColor": "#734fef",
"formatter": "$(x){return numeral(x).format('00')}",
"backgroundColor": "#734fefaa",
"datalabels": {
"color": "#000",
"align": "top",
"anchor": "end"
},
"data": "$any{ROOM_REVENUE}",
"hidden": true
},
{
"label": "Revenue-LY",
"stack": "dd",
"yAxisID": "right-axis",
"borderColor": "#734fef",
"formatter": "$(x){return numeral(x).format('00')}",
"backgroundColor": "#734fefa0",
"datalabels": {
"color": "#000",
"align": "top",
"anchor": "end"
},
"data": "$any{typeof ROOM_REVENUE_LY !== 'undefined' ? RESCOUNT_LY : []}",
"hidden": true
}
]
},
"options": {
"responsive": true,
"title": {
"display": true,
"text": [
""
]
},
"tooltip": {
"mode": "index",
"intersect": false
},
"scales": {
"xAxes": [
{
"ticks": {
"callback": "$(value,index,values){return (value || '').toString().substring(0,8);}"
},
"stacked": true
}
],
"yAxes": [
{
"display": true,
"position": "left",
"type": "linear",
"id": "left-axis",
"ticks": {
"min": 0
}
},
{
"display": true,
"position": "right",
"type": "linear",
"id": "right-axis",
"ticks": {
"min": 100
}
}
]
},
"plugins": {
"datalabels": {
"color": "#ffffff",
"textAlign": "center",
"formatter": "$any{(value) => {return value}}"
}
}
}
},
"chartStyle": {
"width": "100%",
"height": "300px"
},
"gridStyle": {
"width": "100%",
"height": "200px"
},
"drawButton": {
"label": "",
"icon": "insert_chart_outlined",
"style": {}
},
"gridPanelSettings": {
"title": "",
"description": "",
"expanded": true
}
}Last updated
