无法通过 PowerBI 开发工具中的更新方法更新对象 属性
Cannot update object property via the Update Method in PowerBI Development Tools
我在开发 Power BI 方面仍然是初学者,并且
我在使用 "Power BI Development Tools" 时遇到问题。
( https://app.powerbi.com/devTools )
问题是 "I cannot update object property via the update method".
比如我在正文中创建了两个对象,
分别是 "one rectangle" 和 "one text object"。
为了应用 selectAll 方法,我在矩形对象中使用了 selectAll 方法。 (比如输入datapoints增加,应该是更多的矩形)
在这两个对象中,我在它们的属性中写了“++this.count”,
假设当单击 window 或调整 window 大小时,两个对象都会更改字词(文本对象)或宽度(矩形对象)。
然而,结果却是不一样的结果。
单击 window 或调整 window 大小时,文本对象的文字发生了变化,但矩形对象的宽度没有发生变化。
我想请教一下,我想我一定是概念理解有误,但不知道从哪里开始探索比较好。
谁能告诉我
(1) 为什么在更新方法中只有一个对象被改变(更新)?
(2) 我的概念哪一部分是错误的?
非常感谢。
代码如下。
模块powerbi.visuals{
导出接口测试数据{
date_value: 日期
}
export class Test implements IVisual {
public static capabilities: VisualCapabilities = {
};
private element: JQuery;
private body: D3.Selection;
private Debug: D3.Selection;
private svg: D3.Selection;
private TT: D3.Selection;
private RR: D3.Selection;
private selectionManager: utility.SelectionManager;
private dataView: DataView;
private count = 0;
public init(options: VisualInitOptions): void {
var element = options.element;
this.body = d3.select(element.get(0))
.append('div');
this.TT = this.body.append('text')
this.svg = this.body.append('svg')
}
public update(options: VisualUpdateOptions) {
var width = options.viewport.width;
var height = options.viewport.height;
this.body.attr({ 'height': height, 'width': width });
// Text Object
this.TT
.attr("x", 10 * ++this.count)
.attr("y", 10 * ++this.count)
.text(' width = ' + options.viewport.width + '...count = ' + + (++this.count))
// Rectangle Object
// use d3.selectAll method --> as datapoints increases, the number of rectangles will also increase.
var rectangle = this.svg.selectAll("rect")
.data([1]);
rectangle.enter().append("rect")
.attr("y", 10)
.attr("x", 20)
.attr('width', 50 + ((++this.count)))
.attr('height', 100)
.attr('fill', 'red')
rectangle.exit().remove()
}
}
}
您只在 D3 enter 事件上设置矩形 width/height,那是它首次添加到页面时。查看显示如何更新新节点和现有节点的 enter selection code example(这是退出事件之前的最后一个节点)。
因此您需要更改输入代码以执行类似以下操作:
var rectangle = this.svg.selectAll("rect")
.data([1]);
rectangle.enter().append("rect")
.attr("y", 10)
.attr("x", 20);
rectangle.attr('width', 50 + ((++this.count)))
.attr('height', 100)
.attr('fill', 'red');
rectangle.exit().remove();
我在开发 Power BI 方面仍然是初学者,并且 我在使用 "Power BI Development Tools" 时遇到问题。 ( https://app.powerbi.com/devTools )
问题是 "I cannot update object property via the update method".
比如我在正文中创建了两个对象, 分别是 "one rectangle" 和 "one text object"。 为了应用 selectAll 方法,我在矩形对象中使用了 selectAll 方法。 (比如输入datapoints增加,应该是更多的矩形)
在这两个对象中,我在它们的属性中写了“++this.count”, 假设当单击 window 或调整 window 大小时,两个对象都会更改字词(文本对象)或宽度(矩形对象)。
然而,结果却是不一样的结果。 单击 window 或调整 window 大小时,文本对象的文字发生了变化,但矩形对象的宽度没有发生变化。
我想请教一下,我想我一定是概念理解有误,但不知道从哪里开始探索比较好。
谁能告诉我 (1) 为什么在更新方法中只有一个对象被改变(更新)? (2) 我的概念哪一部分是错误的?
非常感谢。
代码如下。
模块powerbi.visuals{ 导出接口测试数据{ date_value: 日期 }
export class Test implements IVisual {
public static capabilities: VisualCapabilities = {
};
private element: JQuery;
private body: D3.Selection;
private Debug: D3.Selection;
private svg: D3.Selection;
private TT: D3.Selection;
private RR: D3.Selection;
private selectionManager: utility.SelectionManager;
private dataView: DataView;
private count = 0;
public init(options: VisualInitOptions): void {
var element = options.element;
this.body = d3.select(element.get(0))
.append('div');
this.TT = this.body.append('text')
this.svg = this.body.append('svg')
}
public update(options: VisualUpdateOptions) {
var width = options.viewport.width;
var height = options.viewport.height;
this.body.attr({ 'height': height, 'width': width });
// Text Object
this.TT
.attr("x", 10 * ++this.count)
.attr("y", 10 * ++this.count)
.text(' width = ' + options.viewport.width + '...count = ' + + (++this.count))
// Rectangle Object
// use d3.selectAll method --> as datapoints increases, the number of rectangles will also increase.
var rectangle = this.svg.selectAll("rect")
.data([1]);
rectangle.enter().append("rect")
.attr("y", 10)
.attr("x", 20)
.attr('width', 50 + ((++this.count)))
.attr('height', 100)
.attr('fill', 'red')
rectangle.exit().remove()
}
}
}
您只在 D3 enter 事件上设置矩形 width/height,那是它首次添加到页面时。查看显示如何更新新节点和现有节点的 enter selection code example(这是退出事件之前的最后一个节点)。
因此您需要更改输入代码以执行类似以下操作:
var rectangle = this.svg.selectAll("rect")
.data([1]);
rectangle.enter().append("rect")
.attr("y", 10)
.attr("x", 20);
rectangle.attr('width', 50 + ((++this.count)))
.attr('height', 100)
.attr('fill', 'red');
rectangle.exit().remove();