tableau-react-internal

Tableau react js engine based in Cooper beta using 2.0.3 (hacks for react already added)

Install

npm install tableau-react-internal

Here is below valid options

const options = {
  height: 100,
  width: 100,
  hideToolbar: true  
  
};

Name	Type	Description
disableUrlActionsPopups	bol	Indicates whether to suppress the execution of URL actions. This option does not prevent the URL action event from being raised. You can use this option to change what happens when a URL action occurs. If set to trueand you create an event listener for the URL_ACTION event, you can use an event listener handler to customize the actions. For example, you can direct the URL to appear in an iframeon your web page. See URL Action Example.
hideTabs	bol	Indicates whether tabs are hidden or shown.
hideToolbar	bol	Indicates whether the toolbar is hidden or shown.
instanceIdToClone	string	Specifies the ID of an existing instance to make a copy (clone) of. This is useful if the user wants to continue analysis of an existing visualization without losing the state of the original. If the ID does not refer to an existing visualization, the cloned version is derived from the original visualization.
height	string	Can be any valid CSS size specifier. If not specified, defaults to the published height of the view.
width	string	Can be any valid CSS size specifier. If not specified, defaults to the published height of the view.
device	string	Specifies a device layout for a dashboard, if it exists. Values can be default, desktop, tablet, or phone. If not specified, defaults to loading a layout based on the smallest dimension of the hosting iframe element.
"filter name"	string	Apply a filter that you specify to the view when it is first rendered. For example, if you have an Academic Year filter and only want to display data for 2022, you might enter "Academic Year": "2022". For more information, see Filtering.
"onFirstInteractive"	callback(e: TableauEvent)	Callback function that is invoked when the Viz object first becomes interactive. This is only called once, but it’s guaranteed to be called. If the Viz object is already interactive, it will be called immediately, but on a separate "thread."
onFirstVizSizeKnown	callback(e: VizResizeEvent)	Callback function that's invoked when the size of the Viz object is known. You can use this callback to perform tasks such as resizing the elements surrounding the Viz object once the object's size has been established.
toolbarPosition	ApiToolbarPosition	Specifies the position of the toolbar, if it is shown. The values can be ApiToolbarPosition.Top or ApiToolbarPosition.Bottom.

Usage

import TableauReport from 'tableau-react-internal';

const myWoorkbook = props => (
  <TableauReport
    url="http://my-site.com/workbook/report"
    token="<TRUSTED TICKET HERE>"
  />
)

Supported props

 


const myWoorkbook = props => (
  <TableauReport
    url="http://reports.my-site.com/my-workbook/my-report"    
    options={options}  
    query="?:embed=yes&:comments=no&:refresh=yes&:toolbar=no&"
  />
)

Changing Filters & Parameters

Any parameters or filters that are initially passed will be sent in the vizCreate options, which speeds up initial loading time by not having to apply each one asynchronously after the viz loads.

Once the viz has been loaded, if the parameters/filters change but the url does not, only the changed parameters/filters will be applied asynchronously in order to optimize performance.

Viz Integration

Upon initialization, a new Viz will be created. A new Viz will only be initialized if props.url changes for performance reasons.

Trusted Tickets

You can authenticate using a trusted ticket, which will be immediately invalidated upon being used, because using it a second time will log the user out.

If props.token gets updated, it will use it the next time a viz is initialized.

Testing

npm install
npm test

Local Development of this package or updating.

1. clone this repo.
2. Do npm install.
3. Make the changes, commit it and raise a PR.

Note: If you don't have write access to the repo, you need to clone it and make changes there and raise a PR to the parent repo.