amcharts 导出无法使用 framework7

Question

我在 framework7 中使用 amcharts。我从服务器获取图表的数据并正确显示。但是当我想导出图表时，没有任何事情发生，好像有什么东西阻止了图表导出为图像。 我有两个用于 javascript 的文件。在 app.js 中我初始化了图表，在 fuctions.js 中我编写了图表代码。 初始化图表一切正常，效果很好。唯一不起作用的是导出部分。我认为 app.js 中的某些内容阻止了它的导出，因为我尝试了没有它的示例代码并且它有效。任何人都可以帮助解决这个问题吗？ app.js：

var theme = 'ios';
if (location.href.indexOf('theme=md') >= 0) theme = 'md';
if (location.href.indexOf('theme=aurora') >= 0) theme = 'aurora';

var plugin = { params: { theme: theme, root: '#app',} };

if (Framework7.use) Framework7.use(plugin);
else if (Framework7.Class && Framework7.Class.use) Framework7.Class.use(plugin);

var $$ = Dom7;
var view;
var app;

var app = new Framework7({
    root: '#app',
    name: 'OHM Sanaz',
    id: 'ir.ohm.Sanaz',
    view:
{
    pushState: false,
    stackPages: true,
},
});

和视图部分：

 view = app.views.create('.view-main', {
    name: "OHMGIS", animate: true, main: true, router: true, pushState: false,
    stackPages: true,
    routes: [
        {
            name: 'home',
            path: '/home/',
            templateUrl: './home.html',
            history: true,
            keepAlive: true,
            options: { transition: 'f7-fade' },
            on:
            {
                pageInit: function (e, page)
                {
                    Init_Page_Home();
              

                },
                pageAfterIn: function (event, page)
                {
            
                },
                pageAfterOut: function ()
                {
       
       
                }
            },
        },
        {
          name: 'charts',
          path: '/charts/',
          templateUrl: './charts.html',
          history: true,
          keepAlive: false,
          options: { transition: 'f7-fade' },
          on: {
              pageInit: function (e, page) {
                Init_Page_Charts();
              },
              pageAfterIn: function (event, page) {

              },
              pageAfterOut: function () {


              }
          },
      },
    ],
});

在 app.js 中导航的图表路由器：

function OnGotoCharts()
{
    view.router.navigate({ name: 'charts' });
}

app.js 中的图表初始化部分：

function ChartPanel(){
Init_Page_Charts();
     CreateXYChart("chartdiv",OMID_Statistical_Object,"Billing_Count","Flag_Type","Bar_Color");
    CreatePieChart("chartdiv",OMID_Statistical_Object,"Billing_Count","Flag_Type","Bar_Color");
}

以及functions.js中的代码：

function CreatePieChart(ID, data, Fld_Value,Fld_Category,Fld_Color)
{ 
    try
    {
    var PieChart_Billing = am4core.create(ID, am4charts.PieChart);
  
// Add data
PieChart_Billing.data = data;

// Add and configure Series
var pieSeries = PieChart_Billing.series.push(new am4charts.PieSeries());
pieSeries.dataFields.value =Fld_Value; 
pieSeries.dataFields.category =Fld_Category; 
pieSeries.slices.template.adapter.add("fill", function (fill, target) {
    return target.dataItem.dataContext["Bar_Color"];
});
pieSeries.slices.template.adapter.add("stroke", function (fill, target) {
    return target.dataItem.dataContext["Bar_Color"];
});

var sliceTemplate = pieSeries.slices.template;
sliceTemplate.strokeWidth = 2;
sliceTemplate.strokeOpacity = 1;

PieChart_Billing.legend = new am4charts.Legend();
// PieChart_Billing.exporting.menu = new am4core.ExportMenu();

}
catch(ex)
{
    alert(ex.message);
}
}

Answer 1

也许您正在尝试在页面实际呈现给 dom 之前呈现图表。尝试在 pageAfterIn 上渲染图表