我正在尝试使用 Power BI REST API 将 Power BI 报告嵌入到我的 Laravel 项目中。报告加载成功。但是,我在向报告应用筛选器时遇到问题,特别是使用 Excel 数据集中名为“合作伙伴名称”的列作为筛选器。我还包括我的图书馆的导入代码。
<head>
<script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/jquery/dist/jquery.js"></script>
<script src="https://microsoft.github.io/PowerBI-JavaScript/demo/node_modules/powerbi-client/dist/powerbi.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/powerbi-client/2.22.4/powerbi.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js" integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/powerbi-client/2.22.4/powerbi.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js" integrity="sha512-3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCVUjkjvPdw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdn.jsdelivr.net/npm/powerbi-models@1.12.6/dist/models.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/powerbi-models@1.12.6/dist/models.min.js"></script>
</head>
<body>
<div id="embedContainer"></div>
<script>
let loadedResolve, reportLoaded = new Promise((res, rej) => { loadedResolve = res; });
let renderedResolve, reportRendered = new Promise((res, rej) => { renderedResolve = res; });
const tokenType = '0';
let report;
const models = window['powerbi-client'].models;
async function embedPowerBIReport() {
let accessToken = 'eyKoxxxUxIx3RNLWzQ';
let embedUrl = 'https://app.powerbi.com/reportEmbed?reportId=4ef9a267-68f5-49ff-b292-6a53195f67 a267asdflyZWN0LmFuYWx5c2lzLndpbmRvd3MubmV0IiwiZW1iZWRGZWF0dXJlcyI6eyJtb2Rlcm5FbWJlZCI6dHJ1ZSwidXNhZ2VNZXRyaWNzVk5leHQiOnRydWV9fQ%3d%3d';
let embedReportId = '4ef9a267-68f5-49ff-b292-6a53195f671f';
const config = {
type: 'report',
tokenType: tokenType == '0' ? models.TokenType.Aad : models.TokenType.Embed,
accessToken: accessToken,
embedUrl: embedUrl,
id: embedReportId,
permissions: models.Permissions.All,
settings: {
filterPaneEnabled: true,
navContentPaneEnabled: true
}
};
let embedContainer = $('#embedContainer')[0];
report = powerbi.embed(embedContainer, config);
report.off("loaded");
report.on("loaded", function () {
loadedResolve();
report.off("loaded");
});
report.off("error");
report.on("error", function (event) {
console.log(event.detail);
});
report.off("rendered");
report.on("rendered", function () {
renderedResolve();
report.off("rendered");
});
}
embedPowerBIReport();
const filter2 = {
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "WBL-AllReviews-Export Less Records.csv",
column: "Partner name"
},
operator: "In",
values: ["WBL-Test"]
};
async function fn3() {
setTimeout(() => {
report.updateFilters(models.FiltersOperations.Add, [filter2])
})
}
async function fn() {
try {
const res1 = await reportLoaded
console.log('reportLoaded:' + res1)
const res2 = await reportRendered
console.log('reportRendered:' + res2)
const res3 = await fn3()
console.log('fn3():' + res3)
} catch (error) {
console.log('Error: ' + error)
}
}
fn()
</script>
上面的代码会导致如下错误,
报告已加载:未定义 powerbi:131 报告渲染:未定义 powerbi:133 fn3():未定义
我还使用以下代码片段尝试了不同的方法: 此代码不会导致任何错误,但过滤部分不起作用。
<script>
let loadedResolve, reportLoaded = new Promise((res, rej) => { loadedResolve = res; });
let renderedResolve, reportRendered = new Promise((res, rej) => { renderedResolve = res; });
let report;
const models = window['powerbi-client'].models;
function embedPowerBIReport() {
const accessToken = 'eyJeXAiOxxxxxxxxxxxxxx';
const embedUrl = 'https://app.powerbi.com/reportEmbed?reportId=4efxxxxxxx-xxxxxd%3dd%3d';
const embedReportId = '4efxxxxxxxxxxxxxxxxxxxxxx';
const tokenType = '0';
const permissions = models.Permissions.All;
const config = {
type: 'report',
tokenType: tokenType == '0' ? models.TokenType.Aad : models.TokenType.Embed,
accessToken: accessToken,
embedUrl: embedUrl,
id: embedReportId,
permissions: permissions,
settings: {
panes: {
filters: {
visible: true
},
pageNavigation: {
visible: true
}
}
}
};
const embedContainer = $('#embedContainer')[0];
report = powerbi.embed(embedContainer, config);
report.off("loaded");
report.on("loaded", function () {
loadedResolve();
report.off("loaded");
});
report.off("error");
report.on("error", function (event) {
console.log(event.detail);
});
report.off("rendered");
report.on("rendered", function () {
renderedResolve();
report.off("rendered");
});
}
async function applyFilter() {
alert("dsfa");
const filter = {
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "WBL-AllReviews-Export Less Records.csv",
column: "Partner name"
},
operator: "In",
values: ["WBL-Test"]
};
await reportLoaded;
await reportRendered;
report.updateFilters(models.FiltersOperations.Add, [filter]);
}
embedPowerBIReport();
try {
setTimeout(applyFilter);
console.log("Report filter was added.");
}
catch (errors) {
console.log(errors);
}
</script>
预期行为:我希望 Power BI 报告在加载报告时根据“合作伙伴名称”列筛选数据。
实际行为:报告加载成功,但未按预期应用过滤。