How to Replace the Yellowfin Loading Spinner

Like most things in Yellowfin, you can customize the loading spinner with a few lines of CSS:

In your custom css file add:

#canvasLoader{
    display: none !important;
}
.clWrapper{
    height: 100px;
    width: 100px;
    z-index: 4000;
    background: url(/customimages/rippleloader.svg) no-repeat center center;
}

Add your loading animation to the ROOT directory of Yellowfin, and adjust the background url accordingly. In this example, my animation is at:

yellowfin/appserver/webapps/ROOT/customimages/rippleloader.svg