Error rendering macro 'rw-search'

null

Page History

Versions Compared

Key

This line was added.
This line was removed.
Formatting was changed.

Comment: Temp update - page name change, new story info

Table of Contents

maxLevel	4
class	contents

Base API Reference

This API will only be available on pages that have the included the “JsAPI/v3” JS file into their page. See example:

Anchor

	top
	top

Overview

Until 2021, this page was known as 'Base API'. The better reflect the contents of this page and the ongoing improvements to our JS API, we decided that 'Advanced API' was a more appropriate name for this page. After a transition period, we'll update the page name to reflect just the new name.

Advanced API Reference

This API will only be available on pages that have the included the “JsAPI/v3” JS file into their page. See example:

<script src="https://pathToYourYellowfinServer/JsAPI/v3"></script>

...

Note
This API will not be available in Dashboard Code Mode.

The Base Advanced API contains a number of functions to assist with loading the Yellowfin APIs in your own web page. There are functions to load the report and dashboard loader APIs which will allow you to load Dashboard and Reports.

There is also a function to assist with session management.

init()

Returns

Promise

Description

Initialises the Base API. This is called when the API is included into a page. Returns a promise to indicate when this has finished loading, any usage of the API should wait until this promise has resolved.

Example

Include the Yellowfin Report API on the page and then load a report after the init() promise has resolved:

<script src="https://pathToYourYellowfinServer/JsAPI/v3"></script>
<div id="reportDiv"></div>
<script>
yellowfin.init().then(() => {
//The Yellowfin base API has now loaded. Now load a report
yellowfin.loadReport({
reportId: 'c83357db-8aef-4ec7-ab72-fce34de9ee77',
element: document.querySelector('div#reportDiv'),
});

});
</script>

logoff()

Returns

Nothing

Description

Ends the current user session.

loadReport(reportOptions)
Anchor
loadreport
loadreport

Returns

Promise

Description

Waits for the init() promise to load and then loads a report with the passed options. Once the report has been loaded it will be appended to the passed element and the report will begin to run.

...

There are a number of options that will be accepted as part of the options object:

reportId (required)

Type: String

ReportUUID of the report we wish to load. This is the PublishUUID on the ReportHeader table.

element (required)

Type: DOM Element, Selector String

...

If no width or height is passed the report will expand to the dimensions of the element.

width

Type: Number

Width to render the report in pixels.

height

Type: Number

Height to render the report in pixels.

filterValues

Type: Array[Object]

Array of Objects that will be used to apply the initial filter values.

...

[{ //Set a between filter
filterId: '1c1e0878-3bd6-402b-bad8-98202e6b8fb1',
valueOne: 15,
valueTwo: 35
}]

instanceName

Type: String

Identifier for this instance of the report. If this property is not defined, a random id will be generated. This means that if you include the same report multiple times without defining an instance name, it will always be a separate instance of that report.

...

//Load the report into two different elements
yellowfin.loadReport({
reportId:'9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
element: document.querySelector('div#firstReport'),
instanceName: 'firstReport'
});

yellowfin.loadReport({
reportId:'9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
element: document.querySelector('div#secondReport'),
instanceName: 'firstReport'
});

showToolbar

Type: Boolean

Determines whether or not to show the reports toolbar.

...

//Load the report with showToolbar set to false
yellowfin.loadReport({
reportId: '9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
element: document.querySelector('div#reportDiv'),
showToolbar: false
});

Image Modified

showTitle

Type: Boolean

Determines whether or not to show the report title in the report’s toolbar. Default: true.

...

//Load the report with showTitle option set to false
yellowfin.loadReport({
reportId: '9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
element: document.querySelector('div#reportDiv'),
showTitle: false
});

showInfo

Type: Boolean

Determines whether or not to show the info option in the report’s toolbar. Default: true

...

//Load the report with showInfo option set to false
yellowfin.loadReport({
   reportId: '9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
   element: document.querySelector('div#reportDiv'),
   showInfo: false
});

showFilter

Type: Boolean

Determines whether or not to show the filters option in the reports toolbar. Default is true.

...

//Load the report with showFilter option set to false
yellowfin.loadReport({
   reportId: '9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
   element: document.querySelector('div#reportDiv'),
   showFilter: false
});

showExport

Type: Boolean

Determine whether or not the export option will be displayed in the report toolbar. Export options allow a report to be exported to an external file format such as csv, xls, pdf, txt and doc.

...

//Load the report with showExport option set to false
yellowfin.loadReport({
   reportId: '9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
   element: document.querySelector('div#reportDiv'),
   showExport: false
});

showShare

Type: Boolean

Determines whether or not to show the share option in the reports toolbar. Default is true.

//Load the report with showShare option set to false
yellowfin.loadReport({
   reportId: '9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
   element: document.querySelector('div#reportDiv'),
   showShare: false
});

showDisplayToggle

Type: Boolean

Determines whether or not to show the reports chart/table options in the reports toolbar. Default is true.

...

//Load the report with this option set to false
yellowfin.loadReport({
   reportId: '9617ada1-28bc-42ef-9c3f-8b40d3d1ae61',
   element: document.querySelector('div#reportDiv'),
   showReportDisplayToggle: false
});

Example

Load the report and then print its name:

yellowfin.loadReport({
reportId: aReportId,
element: elementToRenderTo
}).then(report => {

//Some code to execute when the report has loaded

console.log(report.name + ‘ has finished loading’);
});

Interactions

The interactions object enables you to define which interactions should be available on a particular visualization of a report. This lets you tell the Yellowfin renderer which functionality you want the user to be able to use within that visualization.

...

By default, any interaction that is not explicitly set to false is treated as enabled and will display if the report allows it.

drillDown

Allows drill down functionality to be disabled.

drillAnywhere

Allows drill anywhere functionality to be disabled.

drillThrough

Allows drill through functionality to be disabled.

unitSelection

Allows unit selection functionality to be disabled.

brushing

Allows brushing functionality to be disabled.

timeSlider

Allows the timeSlider functionality to be disabled.

drillBreadcrumbs

Allows drill breadcrumb functionality to be disabled

seriesSelection

Allows seriesSelection functionality to be disabled

annotations

Allows annotations to be disabled.

Example

To disable all user interactivity on the report when using loadReport:

yellowfin.loadReport({

reportId: ‘a report id’,

interactions: {

drillDown: false,

drillAnywhere: false,

drillThrough: false,

unitSelection: false,

brushing: false,

timeSlider: false,

drillBreadcrumbs: false,

seriesSelection: false,

annotations: false

element: document.querySelector(‘#reportElement’)

}).

loadDashboard(dashboardOptions)

Returns

Promise

Description

Waits for the init() promise to load and then loads a dashboard with the passed options. Once the dashboard has been loaded it will be appended to the passed element and the content on the dashboard will begin to run.

There are a number of parameters that can be included in the dashboardOptions object:

dashboardUUID (required)

Type: String

The PublishUUID of the dashboard that you wish to load.

element (required)

Type: DOM Element, Selector String

...

If no width or height is passed the dashboard will fill the dimensions of the element.

filterValues

Type: Array[Object]

Array of Objects that will be used to apply the dashboards initial filter values.

...

[{ //Set a between filter
   filterId: '1c1e0878-3bd6-402b-bad8-98202e6b8fb1',
   valueOne: 15,
   valueTwo: 35
}]

showToolbar

Type: Boolean

Determines whether or not to show the dashboard’s toolbar. Default is true.

...

//Load the dashboard with showToolbar set to false
yellowfin.loadDashboard({
dashboardUUID: '1e68d9cc-fa5a-44e2-816d-782aa40ceeae',
element: document.querySelector('div#dashboardDiv'),
showToolbar: false
});

showInfo

Type: Boolean

Determines whether or not to show the info option in the dashboard’s toolbar. Default: true.

...

//Load the dashboard with showInfo option set to false
yellowfin.loadDashboard({
   dashboardUUID: '1e68d9cc-fa5a-44e2-816d-782aa40ceeae',
   element: document.querySelector('div#dashboardDiv'),
   showInfo: false
});

showShare

Type: Boolean

Determines whether or not to display the share option in the dashboard’s toolbar. Default is true.

...

//Load the dashboard with showShare option set to false
yellowfin.loadDashboard({
dashboardUUID: '1e68d9cc-fa5a-44e2-816d-782aa40ceeae',
element: document.querySelector('div#dashboardDiv'),
showShare: false
});

showFilters

Type: Boolean

Determines whether or not to show the filters option in the dashboard’s toolbar. Default is true.

...

//Load the dashboard with showFilter option set to false
yellowfin.loadDashboard({
dashboardUUID: '1e68d9cc-fa5a-44e2-816d-782aa40ceeae',
element: document.querySelector('div#dashboardDiv'),
showFilter: false
});

scaleCanvasTabs

Type: Boolean

Determines whether or not a canvas tab should be scaled. Default is true.

...

//Load the dashboard with scaleCanvasTabs option set to false
yellowfin.loadDashboard({
dashboardUUID: '1e68d9cc-fa5a-44e2-816d-782aa40ceeae',
element: document.querySelector('div#dashboardDiv'),
scaleCanvasTabs: false
});

showGlobalContentContainer

Determines whether or not to show the global content containers when rendering the dashboard.

...

.querySelector('div#dashboardDiv'),
scaleCanvasTabs: false
});

showGlobalContentContainer

Determines whether or not to show the global content containers when rendering the dashboard.

//Load the dashboard with showGlobalContentContainer option set to false
yellowfin.loadDashboard({
dashboardUUID: '1e68d9cc-fa5a-44e2-816d-782aa40ceeae',
element: document.querySelector('div#dashboardDiv'),
showGlobalContentContainer: false
});

Styleclass

Class	topLink

Base API - Advanced API

Anchor

	embedstories
	embedstories

Embedding stories with the Advanced API

From Yellowfin 9.4, you can embed a story with the publish UUID of the story (see the JS API to embed Yellowfin content wiki page for more info).

Using the Advanced API toolset expands the options available to you when embedding a story, so that you can adjust the look and feel of the story to suit your needs. You may wish to hide contributors or limit the width of the embedded story, and the Advanced API lets you do this.

Advanced API

A new object will be added to the yellowfin object, this will be stories

Code Block

language	js

<script src="http://yellowfinServer/JsAPI/v3"></script>
<div id="myStoryDiv"></div>
<script>
    yellowfin.loadStoryAPI().then(() => {
        yellowfin.stories.loadStory({
             storyUUID: 'a-story-uuid', //This should be the story's publish uuid
             element: document.querySelector('#myStoryDiv') //The div to render the story into
        });
    }
</script>

yellowfin.stories

Currently, yellowfin.stories can only contain one function as shown above — loadStory — which will load the story. However, the loadStory function can take a number of options. The function and its options are outlined below.

loadStory(options);

Details

Returns: Promise

Promise parameters: _story_API

Description

This function loads the story associated with the passed options.storyUUID, and returns a promise that is resolved once complete.

The resolved promise will pass a storyAPI object.

The possible values that can be added to the options object are below.

storyUUID

Details

Embed link option: ?StoryUUID=uuid (This is the PublishUUID for the story to be embedded.)

Description

This option is required: if it is not passed, the loadStory call will fail.

element

Description

Description

This option sets the custom width that should be applied to the banner image.

loadStoryAPI()

Loads the StoryAPI so that we can load stories, returns a promise that is resolved when the API loads.

loadStory(options)

**This is just a pass through option for yellowfin.stories.loadReport the options that are passed to it should be the same, it just ensures that the stories object is loaded before attempting to load a story.

Functions available in the StoryAPI

likeStory()
unlikeStory()
toggleLike(shouldLike:boolean => Default inverse of current value)
getCurrentLikeStatus(successFunction: function to call one the current status is received) => Get status from the server
storyContributors()
storyReaders()

Example:

Code Block
src="<%=YF URL%>/JsAPI/v3?StoryUUID=<%=Story Publish UUID%>&showHeader=false&bannerImageWidth=500"></script>

Example Advanced API :

HTML:

Code Block

language	xml

<script src="<%=YF URL%>/JsAPI/v3"></script>

<div id="storyContainer"></div>

JavaScript:

Code Block

language	js

window.yellowfin.loadStoryAPI().then(() => {
    window.yellowfin.stories.loadStory(
{         storyUUID: '<%=Story Publish UUID%>',          element: 'div#storyContainer'     }
).then((storyAPI) =>
{         console.log(storyAPI);         window.storyAPI = storyAPI;     }
);
});

Styleclass

Class	topLink

Base API - Advanced API

Content

Space Tools

Page History

Versions Compared

Old Version 14

New Version 15

Key

Base API Reference

Overview

Advanced API Reference

init()

Returns

Description

Example

logoff()

Returns

Description

loadReport(reportOptions) Anchorloadreportloadreport

Returns

Description

reportId (required)

element (required)

width

height

filterValues

instanceName

showToolbar

Image Modified

showTitle

showInfo

showFilter

showExport

showShare

showDisplayToggle

Example

Interactions

drillDown

drillAnywhere

drillThrough

unitSelection

brushing

timeSlider

drillBreadcrumbs

seriesSelection

annotations

Example

loadDashboard(dashboardOptions)

Returns

Description

dashboardUUID (required)

element (required)

filterValues

showToolbar

showInfo

showShare

showFilters

scaleCanvasTabs

showGlobalContentContainer

showGlobalContentContainer

Embedding stories with the Advanced API

Advanced API

yellowfin.stories

loadStory(options);

Details

Description

storyUUID

Details

Description

element

showToolbar

Details

Description

showInfo

Details

Description

showExport

Details

Description

showBannerImage

Details

loadReport(reportOptions)
Anchor
loadreport
loadreport