Embedding: Javascript API Reference – Documentation and Support | Knowi

To use the JavaScript API object specified below, be sure to specify the URL to the JavaScript API file in your web page. For more information, see Embedding with Javascript API or code samples. The JavaScript API file is a library that contains functions for interacting with the JavaScript API. It's a minified file and production-ready to be downloaded by the browser.

This section defines the available options for configuring the Knowi Javascript Class.

**JS API Reference**
Name	Type	Descriptions
type	string	type of asset/view to embed Supported values: `share` for dashboard, `secure` for secure hash dashboard, `shareWidget` for widget, `shareWidgetSecure` for secure hash widget, `single` for single sign-on, `nlp` for natural language query
dashboard	string	share URL of dashboard/widget
dashboardId	integer	ID of dashboard/widget
hash	string	Encrypted hash from secure share dashboard/widget. Must be used with type: `secure`, `shareWidgetSecure`
token	string	session token from Single Sign-On. Needed with `type: single`
renderType	string	specifies how embed will be rendered. Options are `object`, `iframe`. Defaults to iframe
url	string	url for on-premise deployments. Defaults to www.knowi.com
view	Object	customizable options for the embedded display.

This section defines the available options for configuring the view object from the Knowi class.

**View Object Reference**
Name	Type	Description
title	bool	enable widget title and action menus
filter	bool	enable dashboard/widget filter
autoHeight	bool	automatically adjust dashboard height to div
border	bool	enable borders around the widget
widgetSpacing	integer	spacing between widgets (px). Possible values between 0-200
setting	bool	enable widget settings
resize	bool	enable widget on a dashboard to be resized
drag	bool	enable widget on a dashboard to be rearranged
scroll	bool	enable scroll on a dashboard
header	bool	enable dashboard header including dashboard name, settings, and dashboard filter
dashListIcon	bool	enable/disable the dashboard listing dropdown (defaults to true) Note: Only applicable for 'single' type of embed. (since the others have it off by default).
backgroundColor	string	background-color of dashboard Supported formats: `rebeccapurple`, HEX value: `#92a8d1`, RGB: `rgb(201, 76, 76`, RGBA: `rgba(201, 76, 76, 0.6)`
analytics	bool	enable Ad-hoc Analytics mode for widgets. Applicable with types: shareWidget, shareWidgetSecure
chat	bool	enable customer support chat
menu	bool	enable side menu with system actions
menuOptions	Object	disable side navigation menu. Defaults to showing all menu options. Applicable with type: single Available options: menuOptions: { logo: true, dashboards: true, widgets: false, queries: true, alerts: false, reports: false, more: false, help: false, profile: false, ml: false, agent: true, opsdash: false }
css	array	inject custom CSS files to override the default styling. Example: ['https://rawgit.com/AntonLapshin/csharp/master/custom1.css', '...']
contentFilters	array	JSON array of user content filters. Applicable with types: share, shareWidget Example: [{"fieldName": "department", "values": ["sales", 19], "operator": "="}, {...}]
nlpOptions	Object	customizable settings for NLP search bar. Applicable with type: nlp Knowi.render('#knowi-div', { type: 'nlp', token: "ii7Cdf7QJy3PaYQLrdZLaGgMnq3Dy2Q1JEhiiuDR9GG64ie", url: 'http://localhost:9090', view: { nlpOptions: { icon: "off", css: { background: 'transparent', width: '80%' }, placeholder: "Try: total sales for canada this week", help: "off", helpText: "Ability to customize the help text of the question mark", defaultView: "visual" } } }, function () { });

CSS Customization

You own custom CSS can be injected into the API. Simply specify a comma-separated list of CSS files and their full path during the initialization.

Knowi.render('#cloud9charts', {
    type: 'touchdown',
    username: 'name',
    password: 'pass',
    view: {
      title: true,
      css: ['https://rawgit.com/AntonLapshin/csharp/master/custom1.css', 'https://rawgit.com/AntonLapshin/csharp/master/custom2.css']
    },
}, function() {
    alert("Loaded")
});

See sample JSFiddle.

Filters

To pass in filters:

    Knowi.render('#cloud9charts', {
       type: 'share',
       dashboard: 'CnzzWr6ZGrii4BYsa295HoVWzNB7VaZey6StgO1uFw2kie'
       view: {
         title: true,
         contentFilters: [
            {
               "fieldName":
               "opened",
               "values":[1000],
               "operator":">"
            },
            {
                "fieldName":"message_type",
                "values":["marketing"],
                "operator":"="
            }
         ]
       },
    }, function() {
       alert("Loaded")
    });

Note: Secure URL modes require contentFilters to be encrypted.

CSS Customization

Filters

Related articles