如何在嵌入式HTML页面内传递外部日期过滤器

时间:2018-01-22 13:33:39

标签: azure powerbi

如何在自定义HTML页面内传递外部日期过滤器(如开始日期和结束日期),以便在我传递这些值并点击提交时呈现报告我有以下HTML页面,它提供嵌入式报告但我我正在尝试使用这些输入框,我该怎么做?

这是可能的还是仍然存在于想法标签中?请指导我如何实现这一目标?

我的HTML代码: -

<html>
<body>
<h2>PowerBI Embedded Report</h2>
<form action="/action_page.php">
  <input type="text" name="sdate" placeholder="Start Date"><br>
  <input type="text" name="edate" placeholder="End Date"><br>
  <input type="submit" value="Submit">
</form>
<script type="text/javascript">

window.onload = function () { 
var models = window['powerbi-client'].models; 
var embedConfiguration = {
    type: 'report',
    accessToken: 'H4sIAAAAAAAEAC2Wx8rGDHaD7-XfOuDeArNw7717Z7_uvbeQe88XZvaCA8-RhP7nHzt7hzkr_vnvf0wUrmKBLexiTDSgmbSBLCFMqVC6-C2i2HSVSJG9OiWtTMjFe-ozi5tfZwsJuH3jRKiWsWGkrJ8kTbfMnVzTj4OKVV9RRz7RZpAwcm40K-EEJQtxbTXppsVoOEkOSnS_vLLEuOgmXJVLj4Z-mVWAoP93FnZcFOOtt5qIhUr68Ey7OjCNk9kjWIJuF8XvESV5RlTJrqiIQtVCcgDiEb6EZby7zRKpFpnIK4_icXPfZt60foH2YSNBtQHYQHrcyRxfpC3FbPcJAwu4H4TQVbtU9FxatuKrgxj7wIgscp_S4lV0XD6zRZ4sXnvbMjhKCFzNVVBFK3Z_3GXY-2idfi7HrvPNC2H1ZnaK-spl4-ZBAuZkahc_n4VMyc9TXfrH41G0YMZ8jA4gPpXGD_A2INi7u4ryh2dTI7IGQLcGVJ5d5XE-vCah0-A992s4Z79skvXXUDmrrsFOQtMAaL38AxqJyYujTXRPVXcW1Lp5UbeqbHGo1214b0TanpkhAdVL9DKEcRwYorfZQuSYqBfifFNzEcaDEj7plWpfEsIjLUPKYCgKpTj8XUiXgPnbbh9aQcZj9A8bXVVJ7T66yq0w6yBK4Y4bbgAUdBsvQEAlwnbhlnfHJFQpEbfnI2ai27xv7wCbJQmPk1RjKAuNW4kyInXvyrlDqEGdWTXIBYrsNWRQzW4VHYaUwTVc2pJ1ca4REmG1XqEgUIqbVY5ZKp0qsiRlSlH_gJiKbOuSDwF-QB7rz1uqc0aB3SJYy1-a8aB7WAnikHqm_1RI2mUvd-P1jLAMNgUIED93o4J1VMNzrPxCZCf2sVMxVxKRG7JmpcW2Z6F-TUlNQXijBdfjIedowwqqvZxxrjHX1xadvDBfG8jvYw_7PDjNBmjXiuI15sW0p-Plb8FS7FY-6vP6bPpMX2xnUWdMF_MFpfEeRRFshol_oHYd5LUSN5FOKicqD46h_kXUPRjPjCbjpD9b3G2lQ2IDEDtHCcd98HyycVCoj1CWd2FHtJMl3y47dZtejF6L9csgg4yJXL_91EQ9nh51IQzVRNTH1CK71jH-IXKkyaMfDrS0xL_lJ4s-bgPr6Uc82FjDdxcCa1sz-Vu_2-iKCEGlN0kJ-GRsgqT2oF_fDQ3WH-xY8-LpISOWs63iuCQ85_o6-l1aY-tjOnyfNIhZzSQuFk7k1bNdLQYIvBae4aBEoGLuMeLzibLWgXL8UoIfgrAJdWPqI1AQs4w1StLipBo6UtvtAqVU6YSqrV8PoLL3zWY5po7RbmibofrbcFH3c5r-U1cS-PqnK9e7p1g9xr4iouek8_m7ZBsYdOcm9fNPnjbRjB1fystufOkjdG8TCAK3SYziSLWejh8mFWg8dhDQfBu8aAKXKxxgO5XOSwLIabNBpvyA_UpKMk_vUWLt4YYkT1HHqbvXW9bxWak6gtCgu5jRCt0tZAcBBge1H1iYip9ZGonoVKjql50clPxVD5JD5UCcUcsfJygcCRC8lc_nJpJpYykXltkwQdg29Ayaw4z9mTcrVMOUlUECcz_x5I99NUwpVwHOxkYlaD37Yo1M1OcMC4DoBnQZQXOXj_6nB1bvsCUK_IGX9FLn0zAM2fvGnAVGDpnMVKA_s_QkHuP-kS1Jh6i95Qi2Ef-fU3KWUJdTgvqrsM_yUubWGyMmY1v7NZ9ghRzn1fVzIAgooVqc4Ioi-SNYTyJNe-rm8uNE204qSw18D_74YIdLncOKQCiztDsRVR3SoaGkZCRKcvJvOiyixD7bI8EKuViPe3oaCS6X9MmlwRFgIPn2AzG5_DPP44wRMsLMlazx3MRWy7x0RFKnPXl_8XJmxtn0GXhkJk6n6Vx3YJeIzgPWvGn9bMn-fhA_HPO4XB-QwBQHZmRfpT7RMtfnSNFy_mnyJMs64j0KnnPRNOU_qFPTseR3VOK5nNFcwrMEAG37QgLcBeKLDfHeKzRY3nkif93uIaaXfdm1c2sicAPO6i6OQVpNppoU9_uv3t5X82YX0qFquk1Mhh1cckAjq9HVAl5DG0G9CQ4i0WOEwvbmgqIPXZdKbjaXctwnuS11dGl_sfxtSCR9oi7Ov9LS-de__vmvf7jtXY5ZK9-_maCHuhkdZADin0C4F0AXWt7AnERSEfneiU5xz_3M3pwPObY0x1WEezH2b_iL6FJiCHuX8hpqqOt74FCd00p7KK8e-d3iy-svelX5oJ8_R8HPKlHSELHCEP_y06NU0wsZM7V-oJxb3rttIOjlKy3VqZw5IFiUitUKYECjTEH2cKCicPt57De29lKSi0LGjoFAQbj2wQu8HZ8jh1MLAda_OwarS8bYACiFKT6fmJ0JpHnT0nLFWqIQN6xHvCZOTm4Y_4Hxj03_1oQZcmDgSZs1Iqz9ANESlLYkDtOMjMvrzrBC8c1qCLmWa4nJI4ldKIp7oPwrdrTGEuaiYi8WODETWCqq_QfzuzTlpoR_lMXoMToQpp6Y75VyYpir6Zx_q7y2nrLj3Mo_WVn8mGR68N4UIbiemwf7WzE5BXNkUiFc0_ayqynxmcbVT7SERI5Q7ew7GfPXom9z0GZBvgVFY8Jl2wBy1oJx5dh7O1yBNZU7yvURaM7GCqJSl99qZOUo04LrPfGcsuEND9SDykxfvpQFbPel7RBlFgsdLdOz-YhcqxHKtEEYZcIfMLDpI9h1b7Dx8TQ5bLr-2nkfhfPgzHXHd2goAFT1B6Uhf0zWcvUUkZ43_5w5ZfaFyfm9dO7k7COMT5sbuZguvkNLdHMwS6qVWXKjBktgbmbyzE2u3lAmMwN88YDl-mCCz5upiqPkCGSOu7Lmi0Q5YP1m98f3h06UeweqzeumWVB1_Yf5f_8PAgjN0hoLAAA=',
    id: 'cd0cbb78-41ca-4db1-b739-e982f59694a2',
    tokenType: models.TokenType.Embed,
    embedUrl: 'https://app.powerbi.com/reportEmbed?reportId=cd0cbb78-41ca-4db1-b739-e982f59694a2&groupId=a78aa4c1-fa2f-4e4d-b21e-3d47bb89618e' 
}; 

var report;
var $reportContainer = $('#reportContainer');

report= powerbi.embed($reportContainer.get(0), embedConfiguration);

var Filter1 = {
$schema: "http://powerbi.com/product/schema#advanced",
target: {
table: "reporting_validation_agg_group",
column: "aggregation_end_date_local_1"
},
logicalOperator: "AND",
conditions: [
{
operator: "LessThanOrEqual",
value: "12/20/2017"
} 
]
}

var Filter2 = {
$schema: "http://powerbi.com/product/schema#advanced",
target: {
table: "reporting_validation_agg_group",
column: "aggregation_end_date_local_1"
},
logicalOperator: "AND",
conditions: [
{
operator: "GreaterThan",
value: "12/10/2017"
} 
]
}

report.on('loaded', event => {
  report.getFilters()
    .then(filters => {

      filters.push(Filter1);
      filters.push(Filter2);
      return report.setFilters(filters);
    });
}); 

}

function reloadreport(){ 

var $reportContainer = $('#reportContainer');
powerbi.embedNew($reportContainer.get(0), embedConfiguration);

};
</script>
<script src="jquery.js"></script>
<script src="es6-promise.js"></script>
<script src="powerbi.js"></script>
<div id="reportContainer"></div>
</body>

</html> 

1 个答案:

答案 0 :(得分:0)

看看此解决方案是否也对您有所帮助: https://community.powerbi.com/t5/Desktop/Power-BI-JavaScript-filter-between-2-dates/td-p/312204

基本上,您定义一个ADVANCED过滤器,'AND'运算符引用两个日期的交集。

但是,您需要将输入文本(或日期选择器)解析为过滤器所需的格式..

请注意,您也可以使用属性loadConfig将过滤器定义为filters: [filter1, filter2]的一部分。