SAC

Today I would like to share with you my new development - custom widgets calendar event for SAC. This is an idea of how custom widgets can be used beyond creating a graph showing numbers. Project premise: To create a calendar that would be able to show up to 4 events per day. The events could last for several days, or they could go between weeks or months. Each event can contain its own description. Potentially, using the widget you can present, for example, a production calendar. ...

Let’s start by creating the popup Rename new window Definitely we should arrange this new space. Start with a new List Box Add tree new buttons: UP, DOWN, Save and Close Change style on List Box to add borders Rename new elements Create a new button on the Canvas Create a script variable Change name and set as array Create onClick event for the new - Change Layout button // Get current dimensions var currentDimensions = Table_Games_Sales.getDimensionsOnRows(); // Assign values to the global variable ScriptVariable_Dimensions_Values = Table_Games_Sales.getDimensionsOnRows(); // Clear the current list ListBox_Dimensions_Order.removeAllItems(); // Add current dimensions to the list for ( var i = 0; i < currentDimensions.length; i++ ){ ListBox_Dimensions_Order.addItem(currentDimensions[i]); } // Open popup Popup_Dimensions_Order.open(); Add code for Button_Save_And_close - onClick // Get all current dimensions var allDimensions = Table_Games_Sales.getDimensionsOnRows(); // Delete all dimensions for (var i = 0; i < allDimensions.length; i++){ Table_Games_Sales.removeDimension(allDimensions[i]); } // Set new dimensions for (var r = 0; r < ScriptVariable_Dimensions_Values.length; r++){ Table_Games_Sales.addDimensionToRows(ScriptVariable_Dimensions_Values[r]); } // Close popup Popup_Dimensions_Order.close(); Add code for Button_Down - onClick // Get all selected Keys var selectedValue = ListBox_Dimensions_Order.getSelectedKey(); // Change the order on the list and update List Box if (selectedValue){ var valueIndex = ScriptVariable_Dimensions_Values.indexOf(selectedValue); ScriptVariable_Dimensions_Values.splice(valueIndex,1); ScriptVariable_Dimensions_Values.splice( valueIndex + 1,0, selectedValue ); ListBox_Dimensions_Order.removeAllItems(); for ( var i = 0; i < ScriptVariable_Dimensions_Values.length; i++){ ListBox_Dimensions_Order.addItem(ScriptVariable_Dimensions_Values[i]); } } Add code for Button_Up - onClick // Get all selected Keys var selectedValue = ListBox_Dimensions_Order.getSelectedKey(); // Change the order on the list and update List Box if (selectedValue){ var valueIndex = ScriptVariable_Dimensions_Values.indexOf(selectedValue); ScriptVariable_Dimensions_Values.splice(valueIndex,1); ScriptVariable_Dimensions_Values.splice( valueIndex - 1,0, selectedValue ); ListBox_Dimensions_Order.removeAllItems(); for ( var i = 0; i < ScriptVariable_Dimensions_Values.length; i++){ ListBox_Dimensions_Order.addItem(ScriptVariable_Dimensions_Values[i]); } } At the end we have a complete and working solution. Congratulations 🍾 !

We need a CheckBox, it can be added from the toolbar Let’s change the background color of the CheckboxGroup. To do this, please click on the brush icon, bucket icon and then on more Change color to hex 1f303f Next change the font color Set new color to white, hex ffffff Remove the values from the Checkbox Rename checkbox to CheckboxGroup_Dimensions, bu click on the keys icon Add additional code to the Application - onInitialization // Get all dimensions var dimensions = Table_Games_Sales.getDataSource().getDimensions(); //Loop by dimensions and fill Checkbox for ( var y = 0; y < dimensions.length; y++ ){ CheckboxGroup_Dimensions.addItem(dimensions[y].id,dimensions[y].description); } Last but not least - we need a button Rename the button Let’s also add a code to handle it // Get current list of dimensions to remove it var currentDimensionsSet= Table_Games_Sales.getDimensionsOnRows(); // Get selected fields from CheckBox var selectedDimensions = CheckboxGroup_Dimensions.getSelectedKeys(); // Delete all existing dimensions for (var r = 0; r < currentDimensionsSet.length; r++){ Table_Games_Sales.removeDimension(currentDimensionsSet[r]); } // Add all new dimensions for (var i = 0; i < selectedDimensions.length; i++){ Table_Games_Sales.addDimensionToRows(selectedDimensions[i]); } At the end-user should be able to pick up interesting dimensions by themself

Button To clean the filter we need a button. Let’s get one from the plus in the toolbar Put the button near the Year dropdown and rename it Go to the Button_Clean_Filters - onClick Put the following code // Remove all filters from the model Table_Games_Sales.getDataSource().removeDimensionFilter("Name"); Table_Games_Sales.getDataSource().removeDimensionFilter("Publisher"); Table_Games_Sales.getDataSource().removeDimensionFilter("Year"); //Set all dropdowns selection to empty Dropdown_Name.setSelectedKey(''); Dropdown_Publisher.setSelectedKey(''); Dropdown_Year.setSelectedKey(''); Button should now work properly Design Please download image dataset from here ...

In this part of the tutorial, we are focusing on creating a cascade filter on the dropdown in SAC APP. Cascade means that filters on the dashboard will depend on each other. In the example, if you pick up the publisher name Nintendo then in the games list (Name) you should see only games that belong to Nintendo and no more others. To achieve this, we have to redesign our app a bit. ...

Firstly we have to move our table a few lines down. This can be done by moving the mouse between the table and toolbar and drag and dropping when the cursor changes the icon: Click on the plus icon on the toolbar Select Dropdown form the list Lets rename the Table by click on tree dots -> Rename, and set new name to Table_Games_Sales Same with Dropdown, and put new name Dropdown_Name ...

We have a model so now it is time to build a SAC APP. Go to applications, click on Create Application Click on the table from at the toolbar Select a existing model Click on model that we created in the previous post Delete columns Add Measure/Dimension to rows Select Name and Publisher Quit panel Save application Click on Run ...

Let’s build a very simple SAC model using kaggle data on video game sales. To create a model on SAC, firstly you have to login into your account (please search for trail if necessary). Next click on files, plus icon, and select model. Now, please click on From a CSV or Excel File Select Source File Download source file from Kaggle. Find vgsales.csv and load into SAC Click on import This model is very simple so we don’t have to change anything. Just click on Create Model Save data model It is done 😎 Now you can use it in the next steps or your own project. Please notice that in the case of more complex datasets before saving you would have to clean the data, assign keys and descriptions or provide additional calculations.