All documentation
  • Introduction
  • Connecting to data source
  • Browser compatibility
  • Documentation for older versions
  • Troubleshooting Flexmonster

    In this guide, you can find solutions to errors that you might experience while working with Flexmonster Pivot. If your error is not listed here, contact our technical support.

    Integration issues

    If you are facing any integration issues, open developer tools on the page with Flexmonster:

    • On Windows and Ubuntu/Linux, press Ctrl + Shift + I or F12.
    • On macOS, press Command + Option + I.

    Then go to the console and check if it shows any errors. If so, look for solutions to the errors in this section.

    Console error: 'GET <any URL>/flexmonster.js 404 (Not Found)'

    The flexmonster.js file was not loaded successfully. Ensure that the correct path to flexmonster.js is specified. It depends on how you have downloaded Flexmonster:

    Flexmonster CLI or npm

    <script src="node_modules/flexmonster/flexmonster.js"></script>

    CDN

    <script src="https://cdn.flexmonster.com/flexmonster.js"></script>

    ZIP package

    <script src="flexmonster/flexmonster.js"></script>

    Console errors: 'Uncaught ReferenceError: Flexmonster is not defined', 'ReferenceError: Can't find variable: Flexmonster'

    The new Flexmonster() API call was used to embed the component, but the flexmonster.js file was not loaded successfully. This may be caused by one of the following:

    • Wrong URL to the file. Make sure that the URL to flexmonster.js is correct. The path to flexmonster.js depends on how you have downloaded Flexmonster:

      Flexmonster CLI or npm

      <script src="node_modules/flexmonster/flexmonster.js"></script>

      CDN

      <script src="https://cdn.flexmonster.com/flexmonster.js"></script>

      ZIP package

      <script src="flexmonster/flexmonster.js"></script>
    • No internet connection. An internet connection is necessary when loading flexmonster.js from remote resources (e.g., CDN). Check your internet connection status.
    • An issue with accessing flexmonster.js. Make sure that the current user has enough privileges.

    Console errors: 'ERROR TypeError: Flexmonster is not a constructor', 'ERROR TypeError: window.Flexmonster is not a function'

    Flexmonster embedding failed since the flexmonster.js file was not loaded successfully. Check the following:

    • Ensure that you have specified the correct path to flexmonster.js, depending on how Flexmonster was downloaded:

      Flexmonster CLI or npm

      <script src="node_modules/flexmonster/flexmonster.js"></script>

      CDN

      <script src="https://cdn.flexmonster.com/flexmonster.js"></script>

      ZIP package

      <script src="flexmonster/flexmonster.js"></script>
    • If you are using a module bundler, ensure it includes Flexmonster in the build correctly.

    Console error: 'SCRIPT5009: Flexmonster is undefined'

    This error appears in Internet Explorer 11 because IE does not support the ES6 standard used by Flexmonster. Learn more in our blog post: Flexmonster stops providing the ECMAScript 2009 (ES5) version of the product.

    Pop-up alert and console errors: 'Flexmonster: Unable to create the component. DOM element is null.'

    The container parameter is missing from the new Flexmonster() API call. Set the container parameter as follows:

    <div id="pivotContainer">Flexmonster will appear here</div>
    
    <script>
      const pivot = new Flexmonster({
        container: "pivotContainer",
        // Other parameters
      });
    </script>

    Pop-up alert and console errors: 'Flexmonster: Unable to create the component. DOM element with id [container id] is not found.'

    There is no HTML element with the id specified in the new Flexmonster()’s container parameter ([container id]). Make sure an element with the [container id] id exists.

    Pop-up alert error: 'Flexmonster: Pivot cannot be drawn.'

    The contents of the flexmonster/ folder were not loaded successfully. Ensure that the correct path to flexmonster/ is specified in the componentFolder parameter. The path to flexmonster/ depends on how you have downloaded Flexmonster:

    Flexmonster CLI or npm

    const pivot = new Flexmonster({
      container: "pivotContainer",
      componentFolder: "node_modules/flexmonster/",
      // Other parameters
    });

    CDN

    const pivot = new Flexmonster({
      container: "pivotContainer",
      componentFolder: "https://cdn.flexmonster.com/",
      // Other parameters
    });

    ZIP package

    const pivot = new Flexmonster({
      container: "pivotContainer",
      componentFolder: "flexmonster/",
      // Other parameters
    });

    Console error: 'GET <any URL>/<your componentFolder parameter>/flexmonster.css net::ERR_FILE_NOT_FOUND'

    The contents of the flexmonster/ folder with all Flexmonster files (including flexmonster.css) were not loaded successfully. Ensure that the correct path to flexmonster/ is specified in the componentFolder parameter. The path to flexmonster/ depends on how you have downloaded Flexmonster:

    Flexmonster CLI or npm

    const pivot = new Flexmonster({
      container: "pivotContainer",
      componentFolder: "node_modules/flexmonster/",
      // Other parameters
    });

    CDN

    const pivot = new Flexmonster({
      container: "pivotContainer",
      componentFolder: "https://cdn.flexmonster.com/",
      // Other parameters
    });

    ZIP package

    const pivot = new Flexmonster({
      container: "pivotContainer",
      componentFolder: "flexmonster/",
      // Other parameters
    });

    Console errors: 'GET <any URL>/<your componentFolder parameter>/theme/assets/flexmonster-icons.woff net::ERR_FILE_NOT_FOUND', 'GET <any URL>/<your componentFolder parameter>/theme/assets/flexmonster-icons.ttf net::ERR_FILE_NOT_FOUND'

    The theme/assets/ folder is missing from the flexmonster/ folder. To fix this, remove Flexmonster from your project and download it again.

    Console error: 'GET <any URL>/<your componentFolder parameter>/toolbar/flexmonster.toolbar.js net::ERR_FILE_NOT_FOUND'

    The toolbar/ folder is missing from the flexmonster/ folder and toolbar: true was specified when embedding the component. To fix this, remove Flexmonster from your project and download it again.

    Console error: 'GET <any URL>/<your componentFolder parameter>/lib/<filename> net::ERR_FILE_NOT_FOUND'

    Errors like this may appear in the console if the lib/ folder is missing from the flexmonster/ folder or if the necessary file was removed from lib/.

    To get rid of such errors, remove Flexmonster from your project and download it again.

    Console warning: 'Flexmonster: CSS version mismatch'

    flexmonster.css and flexmonster.js versions do not match. This can happen if flexmonster.css has not been updated along with other Flexmonster files.

    Check which JavaScript and CSS versions are specified in the warning's text. Alternatively, you can check flexmonster.css and flexmonster.js versions by viewing these files through the Sources tab in your browser’s developer tools.

    See how the version is specified in CSS and JavaScript files:

    flexmonster.css

    :root {
      --fm-version: "<version>"
    }

    flexmonster.js

    /** 
     * Flexmonster Pivot Table & Charts
     * <version>
    */

    If flexmonster.css and flexmonster.js versions are not the same, follow the steps below:

    1. Update flexmonster.css and flexmonster.js to the same version.
    2. Clear your browser cache to make sure the browser does not load cached Flexmonster files.
    3. In the browser, check if flexmonster.css and flexmonster.js versions match.

    If the warning persists, contact our technical support.

    Issues with license keys

    This section lists solutions to errors that may occur with license keys.

    Pop-up alert 'Domain mismatch': Flexmonster is used on the domain <domain name>, which does not match the domain your license key was issued for.

    Your license key is tied to a specific domain (e.g., example.com) and will not work on any other domain.

    Make sure your license key is used on the domain it was issued for (e.g., example.com). If you need a license key for another domain, contact our team.

    Pop-up alert 'Limitation': Integration with third-party charting libraries is not available in the trial version.

    You are integrating with a third-party charting library while using a trial license key. This key does not support integration with third-party charting libraries. Contact our team to request a special trial key.

    For our customers, we recommend replacing the trial key with their development or production license key.

    Pop-up alert 'Maintenance expired': Your license key does not support the Flexmonster version you are using. Please renew your maintenance to stay on this version.

    Flexmonster has been updated to the version that is not covered by the license key you are using. To continue using this version, renew your maintenance and get a new license key. Contact our team for assistance. If you are facing this error after the renewal, please ensure that you have updated the license key in the component.

    Alternatively, you can downgrade the Flexmonster version to the latest supported version. You can find it in the Maintenance expired pop-up message. If the supported version is not shown in the message, contact our team.

    Note that the component might update unexpectedly when:

    • The npm update command is run.
    • The latest Flexmonster version from our CDN is used.

    To avoid unexpected updates, we recommend locking the Flexmonster version. Steps to lock the version depend on how you have downloaded Flexmonster:

    Flexmonster CLI or npm

    Install the exact Flexmonster version using the --save-exact flag:

    npm install flexmonster@2.9.54 --save-exact

    CDN

    Replace a link to the latest Flexmonster version with a link to a specific version:

    <script src="https://cdn.flexmonster.com/2.9.54/flexmonster.js"></script>

    Pop-up alert 'Dev key in use': You are trying to use a development key on a real domain (<domain name>).

    A development license key is used on a real domain. With the development key, the component can be run only locally on your computer (localhost), on a server using the server’s IP address, or on a .local domain.

    To get a license key for the real domain (e.g., example.com), contact our team.

    If you already have a key for the real domain, please ensure that you have set the license key for the component.

    Pop-up alert 'License expired': Your license period has expired.

    Your license key has expired. To renew your annual subscription, contact our team.

    If you are facing this error after the renewal, please ensure that you have updated the license key in the component.

    Pop-up alert 'Trial period expired'

    Your trial license key has expired. To extend the trial period and get a new key, contact our team.

    If you have already purchased a Flexmonster license, please ensure that you have set the license key for the component.

    Pop-up alert 'Invalid key'

    Only a part of the license key has been set in the component. Ensure that you have copied the license key correctly.

    Pop-up alert 'Corrupted key'

    Only a part of the license key has been set in the component. Ensure that you have copied the license key correctly.

    Pop-up alert 'Key template in use'

    A key placeholder is used instead of a real license key. Replace "XXXX-XXXX-XXXX-XXXX-XXXX" with your actual key.

    If you don't have a license key, contact our team.

    Pop-up alert 'No license key': License key not found. Please set your key for the component.

    This message may be caused by one of the following:

    • A license key is not specified. See how to set the license key for the component.
      If you don’t have a license key, contact our team.
    • Wrong URL to a file or a server-side script specified in the licenseFilePath property. Ensure that the URL is correct.
    • No internet connection that is needed to load a license key specified in the licenseFilePath property. Check your internet connection status.
    • Issue with accessing a file or a server-side script specified in the licenseFilePath property. Make sure that the current user has enough privileges.

    Pop-up alert 'Empty license key'

    An empty license key is used. Please set your actual key in the component.

    If you don’t have a license key, contact our team.

    Pop-up alert error: Your license key is outdated and will not function with the current version. Please contact our team to find out about upgrade options.

    Flexmonster has been updated to the version that is not covered by your license maintenance. You should renew your maintenance or downgrade the Flexmonster version. To renew the license maintenance or find out which version you can use, contact our team. If you are facing this error after the renewal, please ensure that you have updated the license key in the component.

    Note that the component might update unexpectedly when:

    • The npm update command is run.
    • The latest Flexmonster version from our CDN is used.

    To avoid unexpected updates, we recommend locking the Flexmonster version. Steps to lock the version depend on how you have downloaded Flexmonster:

    Flexmonster CLI or npm

    Install the exact Flexmonster version using the --save-exact flag:

    npm install flexmonster@2.9.54 --save-exact

    CDN

    Replace a link to the latest Flexmonster version with a link to a specific version:

    <script src="https://cdn.flexmonster.com/2.9.54/flexmonster.js"></script>

    Issues with data sources

    Here you can find solutions to errors that you may face when connecting to the data source or loading data into Flexmonster.

    Pop-up alert error: Unable to open the <filename> file.
    Check the following points to resolve the issue:
    - make sure the file exists
    - make sure the 'Access-Control-Allow-Origin' header is present in the requested resource
    - check the browser console for any errors

    This message may be caused by one of the following:

    • There is no file with this name on the server. Make sure you are using the correct filename.
      Note that if you are trying to connect to a local file, the filename property will not work since JavaScript has no access to the filesystem.
      To open a local file, use the dataSource.browseForFile property or the Connect Toolbar tab. Alternatively, you can upload the file to a server and refer to it in the filename property.
    • Your browser requires more privileges to load the data. By default, cross-domain requests from JavaScript are blocked. Enable CORS to make such requests. Refer to enable-cors.org for more details on how to resolve this issue.
    • Internal server error. Open the browser’s console and check it for errors. Also, check errors on the server that hosts the file you are referring to.

    Pop-up alert error: Error opening URL. Please check your Internet connection.

    This error may be caused by one of the following:

    • No internet connection. Check your internet connection status.
    • An issue with accessing the data. Make sure that the current user has enough privileges.
    • Internal server error. Check whether you have any errors in the browser’s console. Also, check errors on the server side of your application.
    • Wrong URL to the data source. Ensure that the URL is correct.

    Pop-up alert error: The data source or catalog is invalid. Please check the connection details.

    The catalog or cube name used for the connection to the cube is incorrect. Ensure that you have specified them correctly. To get the exact catalog and cube names, use the Toolbar:

    1. Choose the Connect tab and select To OLAP (XMLA).
    2. Enter your Proxy URL and click Connect.
    3. Select the data source from the Data source info dropdown menu.
    4. Choose the catalog from the Catalog dropdown menu.
    5. Select the cube name from the Cube dropdown menu.

    Another possible cause of this error message is an internal server error. Check your browser’s console for any errors. Also, check errors on the server side of your application.

    Pop-up alert error: A stream error occurred while loading <data source URL>

    This error may be caused by one of the following:

    • There is no such data source. Ensure that the data source with the specified connection parameters exists.
    • An issue with accessing the data. Make sure that the current user has sufficient rights to access the data.
    • CORS issue. Make sure that cross-domain requests are allowed. Refer to enable-cors.org for more details.
    • Internal server error. Check your browser’s console for errors. Also, check errors on the server that hosts the data source.
    • No internet connection. Check your internet connection status.
    • CORS for Internet Information Services is disabled. If you are using SSAS via XMLA protocol, enable cross-origin resource sharing for Internet Information Services (IIS). Check out our detailed step-by-step guide. We also suggest trying our special server-side proxy called Flexmonster Accelerator instead of XMLA (read more).

    Pop-up alert error: The file is too large and cannot be loaded completely due to the browser limitations.

    This error might occur in the Google Chrome browser if you load large JSON or CSV data using the dataSource.filename property.

    You can resolve this error in one of the following ways:

    • Use Flexmonster Data Server. This approach ensures that only part of the data you need to visualize is loaded into the component, while the entire JSON or CSV dataset is stored on the server.
    • Load data in a JSON format with the dataSource.useStreamLoader set to true. This allows loading the large data in small chunks.
      If you are using CSV data, we recommend converting it into a JSON array or arrays, since this format is very similar to CSV.

    Pop-up alert and console errors: Unable to connect to the Elasticsearch endpoint 'XXX'.
    Check the following points to resolve the issue:
    - make sure that the URL is correct
    - enable CORS
    - check the browser console for any errors

    This message may be caused by one of the following:

    • Incorrect URL to your Elasticsearch endpoint. Ensure that you have specified the correct URL in the dataSource.node property.
    • CORS issue. Cross-domain requests from JavaScript are blocked. Enable CORS to allow such requests.
    • Internal server error. Check for errors in your browser’s console. Also, check errors on the server that hosts Elasticsearch.
    • No internet connection. Check your internet connection status.

    Pop-up alert and console errors: no such index [XXX]

    The specified Elasticsearch index does not exist on your server. Make sure you have specified the correct index in the dataSource.index property.

    Pop-up alert and console errors: [1:122] [date_histogram] unknown field [calendar_interval], parser not found

    Starting from version 2.9.26, Flexmonster applies the mapping calendar_interval property to the date fields in the slice by default. The calendar_interval is not available in Elasticsearch versions before 7.2.

    If your version of Elasticsearch is older than 7.2 and you are using dates in the slice, specify the interval property in the mapping explicitly to fix the error. For example:

    report: {
      dataSource: {
        type: "elasticsearch",
        // Other configs
        mapping: {
          "YourDateField": {
            interval: "day"
          }
        }
      }
    }

    Pop-up alert and console errors: [1:122] [date_histogram] unknown field [fixed_interval], parser not found

    You are using the mapping fixed_interval property, which is not supported in your version of Elasticsearch. The fixed_interval was added to Elasticsearch in version 7.2 and is not available in older versions.

    To fix the error, specify the interval property in the mapping instead of fixed_interval. For example:

    report: {
      dataSource: {
        type: "elasticsearch",
        // Other configs
        mapping: {
          "YourDateField": {
            interval: "3h"
          }
        }
      }
    }

    Other issues

    Issue: Invalid or blank dates are displayed in the component

    This issue occurs when your dataset contains dates in a format that is not officially supported by Flexmonster.

    To resolve the issue, define dates in a supported format.

    Issue: Text in the component or the exported report file is not displayed correctly

    If you are using data or localization with non-Latin characters, the following issues might occur:

    • Data or localized elements are not displayed correctly in the component or the exported report file. For example, all characters are replaced with "?".
    • When exporting a report, the resulting file is corrupted.

    To resolve such issues, set the UTF-8 encoding for your HTML page. There are two ways to do this:

    • Specify the UTF-8 encoding in the Content-Type HTTP header or the corresponding meta tag on your page:
      <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    • Embed Flexmonster Pivot in a separate .js file and specify the UTF-8 encoding when referencing it:
      <script src="yourfile.js" charset="UTF-8"></script>

    If you are exporting the report with non-Latin characters to PDF, use the exportTo() method with the params.fontUrl property set to the URL that leads to the necessary TTF font file.

    Note Data in a database, a JSON file, or a CSV file must also be encoded as UTF-8.

    Pop-up alert error: 'Can't enter fullscreen'

    The fullscreen feature is blocked by the Feature-Policy fullscreen directive sent from your server. To permit fullscreen, add your project’s domain name to the directive’s allow list. For example:

    Feature-Policy: fullscreen https://example.com

    Pop-up alert and console errors: 'Can't save file. Invalid string length.'

    This issue occurs when you are trying to save the report to a server using the save() API call, but the report is too large to be encoded.

    To resolve the issue, set the serverContentType parameter of the save() method to "application/json":

    pivot.save({ 
    filename: "report.json",
    destination: "server",
    url: "https://example.com/",
    serverContentType: "application/json"
    });

    Still need help?

    Try the following steps:

    1. Search for related information on our website.
    2. Look through the search results. If your topic is already covered in the documentation or support cases, check out the suggested solutions.
    3. Raise a support ticket if you need additional help.