如何在Qliksense Mashups中的Hypercube中将数据存储在变量中？

Question

我正在使用apexcharts.js在qliksense Mashups中构建“面积图”，并且创建了hypercube，还能够在控制台中打印数据。我想将超立方体数据存储在Array中并推到图表。
我该怎么办？
请帮忙。

Apexcharts https://apexcharts.com/javascript-chart-demos/area-charts/stacked/

打印数据  console.log（reply）;

/*
 * Bootstrap-based responsive mashup
 * @owner Enter you name here (xxx)
 */
/*
 *    Fill in host and port for Qlik engine
 */
var prefix = window.location.pathname.substr( 0, window.location.pathname.toLowerCase().lastIndexOf( "/extensions" ) + 1 );

var config = {
	host: window.location.hostname,
	prefix: prefix,
	port: window.location.port,
	isSecure: window.location.protocol === "https:"
};
//to avoid errors in workbench: you can remove this when you have added an app
var app;
require.config( {
	baseUrl: (config.isSecure ? "https://" : "http://" ) + config.host + (config.port ? ":" + config.port : "" ) + config.prefix + "resources"
} );

require( ["js/qlik"], function ( qlik ) {

	var control = false;
	qlik.setOnError( function ( error ) {
		$( '#popupText' ).append( error.message + "<br>" );
		if ( !control ) {
			control = true;
			$( '#popup' ).delay( 1000 ).fadeIn( 1000 ).delay( 11000 ).fadeOut( 1000 );
		}
	} );

	$( "#closePopup" ).click( function () {
		$( '#popup' ).hide();
	} );
	if ( $( 'ul#qbmlist li' ).length === 0 ) {
		$( '#qbmlist' ).append( "<li><a>No bookmarks available</a></li>" );
	}
	$( "body" ).css( "overflow: hidden;" );
	function AppUi ( app ) {
		var me = this;
		this.app = app;
		app.global.isPersonalMode( function ( reply ) {
			me.isPersonalMode = reply.qReturn;
		} );
		app.getAppLayout( function ( layout ) {
			$( "#title" ).html( layout.qTitle );
			$( "#title" ).attr( "title", "Last reload:" + layout.qLastReloadTime.replace( /T/, ' ' ).replace( /Z/, ' ' ) );
			//TODO: bootstrap tooltip ??
		} );
		app.getList( 'SelectionObject', function ( reply ) {
			$( "[data-qcmd='back']" ).parent().toggleClass( 'disabled', reply.qSelectionObject.qBackCount < 1 );
			$( "[data-qcmd='forward']" ).parent().toggleClass( 'disabled', reply.qSelectionObject.qForwardCount < 1 );
		} );
		app.getList( "BookmarkList", function ( reply ) {
			var str = "";
			reply.qBookmarkList.qItems.forEach( function ( value ) {
				if ( value.qData.title ) {
					str += '<li><a data-id="' + value.qInfo.qId + '">' + value.qData.title + '</a></li>';
				}
			} );
			str += '<li><a data-cmd="create">Create</a></li>';
			$( '#qbmlist' ).html( str ).find( 'a' ).on( 'click', function () {
				var id = $( this ).data( 'id' );
				if ( id ) {
					app.bookmark.apply( id );
				} else {
					var cmd = $( this ).data( 'cmd' );
					if ( cmd === "create" ) {
						$( '#createBmModal' ).modal();
					}
				}
			} );
		} );
		$( "[data-qcmd]" ).on( 'click', function () {
			var $element = $( this );
			switch ( $element.data( 'qcmd' ) ) {
				//app level commands
				case 'clearAll':
					app.clearAll();
					break;
				case 'back':
					app.back();
					break;
				case 'forward':
					app.forward();
					break;
				case 'lockAll':
					app.lockAll();
					break;
				case 'unlockAll':
					app.unlockAll();
					break;
				case 'createBm':
					var title = $( "#bmtitle" ).val(), desc = $( "#bmdesc" ).val();
					app.bookmark.create( title, desc );
					$( '#createBmModal' ).modal( 'hide' );
					break;
			}
		} );
	}


	//open apps -- inserted here --
	var app = qlik.openApp('Store.qvf', config);


	//get objects -- inserted here --
	//create cubes and lists -- inserted here --
	app.createCube({
	"qInitialDataFetch": [
		{
			"qHeight": 20,
			"qWidth": 2
		}
	],
	"qDimensions": [
		{
			"qLabel": "Product_Category",
			"qLibraryId": "VJfbVp",
			"qNullSuppression": true,
			"qOtherTotalSpec": {
				"qOtherMode": "OTHER_OFF",
				"qSuppressOther": true,
				"qOtherSortMode": "OTHER_SORT_DESCENDING",
				"qOtherCounted": {
					"qv": "5"
				},
				"qOtherLimitMode": "OTHER_GE_LIMIT"
			}
		}
	],
	"qMeasures": [
		{
			"qDef": {
				"qDef": "Sum(Sales)"
			},
			"qLabel": "Sum(Sales)",
			"qLibraryId": null,
			"qSortBy": {
				"qSortByState": 0,
				"qSortByFrequency": 0,
				"qSortByNumeric": 0,
				"qSortByAscii": 1,
				"qSortByLoadOrder": 0,
				"qSortByExpression": 0,
				"qExpression": {
					"qv": " "
				}
			}
		}
	],
	"qSuppressZero": false,
	"qSuppressMissing": false,
	"qMode": "S",
	"qInterColumnSortOrder": [],
	"qStateName": "$"
	},testdata);


	if ( app ) {
new AppUi( app );
}


	//callbacks
		function testdata(reply, app){
	   
     console.log(reply);
		//remove all d3 elements from svg

	   // Pass Data into data variable



// ApexCharts
		 var options = {
		       chart: {
		         height: 350,
		         type: 'area',
		         stacked: true,
		         events: {
		           selection: function(chart, e) {
		             console.log(new Date(e.xaxis.min) )
		           }
		         },

		       },
		       colors: ['#008FFB', '#00E396', '#CED4DC'],
		       dataLabels: {
		           enabled: false
		       },
		       stroke: {
		         curve: 'smooth'
		       },

		       series: [{
		           name: 'South',
		           data: generateDayWiseTimeSeries(new Date('11 Feb 2017 GMT').getTime(), 20, {
		             min: 10,
		             max: 60
		           })
		         },
		         {
		           name: 'North',
		           data: generateDayWiseTimeSeries(new Date('11 Feb 2017 GMT').getTime(), 20, {
		             min: 10,
		             max: 20
		           })
		         },

		         {
		           name: 'Central',
		           data: generateDayWiseTimeSeries(new Date('11 Feb 2017 GMT').getTime(), 20, {
		             min: 10,
		             max: 15
		           })
		         }
		       ],
		       fill: {
		         type: 'gradient',
		         gradient: {
		           opacityFrom: 0.6,
		           opacityTo: 0.8,
		         }
		       },
		       legend: {
		         position: 'top',
		         horizontalAlign: 'left'
		       },
		       xaxis: {
		         type: 'datetime'
		       },
		     }

		     var chart = new ApexCharts(
		       document.querySelector("#chart"),
		       options
		     );

		     chart.render();

		     /*
		       // this function will generate output in this format
		       // data = [
		           [timestamp, 23],
		           [timestamp, 33],
		           [timestamp, 12]
		           ...
		       ]
		       */
		     function generateDayWiseTimeSeries(baseval, count, yrange) {
		       var i = 0;
		       var series = [];
		       while (i < count) {
		         var x = baseval;
		         var y = Math.floor(Math.random() * (yrange.max - yrange.min + 1)) + yrange.min;

		         series.push([x, y]);
		         baseval += 86400000;
		         i++;
		       }
		       return series;
		     }
	   }




} );

<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
<script src="../../resources/assets/external/requirejs/require.js"></script>
  <script src="SalesMashups.js"></script>
</head>
<body>
<div id="chart"></div>
</body>
</html>