Flexmonster MCP Server is here! Connect your ✨AI assistant to our documentation. Get started
+

JavaScript Pivot Table with Elasticsearch

Flexmonster Pivot Table & Charts provides a seamless connection to Elasticsearch.


    new Flexmonster({
      container: "#pivot-container",
      componentFolder: "https://cdn.flexmonster.com/",
      height: 600,
      toolbar: true,
      report: {
        dataSource: {
          type: "elasticsearch",
          node: "https://olap.flexmonster.com:9200",
          index: "australian_weather",
          mapping: {
            "Date": {
              caption: "Date",
              format: "yyyy",
              interval: "1y"
            },
            "Min Temperature": {
              caption: "Min Temp"
            },
            "Max Temperature": {
              caption: "Max Temp"
            },
            "Rainfall": {
              caption: "Rainfall"
            },
            "Evaporation": {
              caption: "Evaporation"
            },
            "Sunshine": {
              caption: "Sunshine"
            },
            "Wind Speed": {
              caption: "Wind Speed"
            },
            "Rain Today": {
              caption: "Rain Today"
            },
            "Rain Tomorrow": {
              caption: "Rain Tomorrow"
            },
            "Location.keyword": {
              caption: "Location"
            },
            "State.keyword": {
              caption: "State"
            }
          }
        },
        slice: {
          rows: [
            {
              uniqueName: "State.keyword"
            },
            {
              uniqueName: "Location.keyword"
            }
          ],
          columns: [
            {
              uniqueName: "Date",
              filter: {
                query: {
                  after: "2008-12-31"
                }
              }
            },
            {
              uniqueName: "[Measures]"
            }
          ],
          measures: [
            {
              uniqueName: "Min Temperature",
              aggregation: "min",
              format: "temperature"
            },
            {
              uniqueName: "Max Temperature",
              aggregation: "max",
              format: "temperature"
            },
            {
              uniqueName: "Wind Speed",
              aggregation: "average",
              format: "windSpeed"
            }
          ]
        },
        options: {
          grid: {
            showTotals: "off",
            showGrandTotals: "off"
          },
          showAggregationLabels: false
        },
        conditions: [
          {
            formula: "#value > 42",
            measure: "Max Temperature",
            aggregation: "max",
            format: {
              backgroundColor: "#FFB74D",
              color: "#000000",
              fontFamily: "Arial",
              fontSize: "12px"
            }
          },
          {
            formula: "#value < 0",
            measure: "Min Temperature",
            aggregation: "min",
            format: {
              backgroundColor: "#81D4FA",
              color: "#000000",
              fontFamily: "Arial",
              fontSize: "12px"
            }
          }
        ],
        formats: [
          {
            name: "",
            decimalPlaces: 1
          },
          {
            name: "temperature",
            currencySymbol: " °C",
            positiveCurrencyFormat: "1$",
            negativeCurrencyFormat: "-1$"
          },
          {
            name: "windSpeed",
            currencySymbol: " km/h",
            positiveCurrencyFormat: "1$",
            negativeCurrencyFormat: "-1$"
          }
        ]
      },
      beforetoolbarcreated: function (toolbar) {
        toolbar.showShareReportTab = true;
      },
      shareReportConnection: {
        url: "https://olap.flexmonster.com:9500"
      }
    });
    
    <div id="pivot-container"></div>
    

    With the Flexmonster JavaScript library, Elasticsearch data visualization is made simple. You can get the insights based on gigabytes of data.

    Fetch summarized data from your index, display it on the pivot grid or charts, and start revealing insights instantly.

    Find more details on how the Flexmonster reporting tool works with Elasticsearch data and how to connect to Elasticsearch.

    Frequently asked questions

    Can't find your answer here?
    Visit the FAQ page

    Flexmonster Pivot Table & Charts is a JavaScript pivot table component for adding interactive reporting and data analysis to web applications. Users can summarize, filter, sort, and explore data in pivot tables and charts, drill into results, and export reports.