Question

我正处于创建Power BI自定义地图视觉效果的早期阶段。目前，我只是想显示一张空白的美国地图。我正在使用GeoJSON数据，已将其添加到程序包中，如下所示：

将JSON保存到JavaScript文件中，并在其周围添加var jsonData = {}。
将此JavaScript文件添加到我的node_modules文件夹的geojson子文件夹中
为清单添加了一个额外的ExternalJS引用-"node_modules/geojson/us-states.js"

现在，我开始按照以下方式构建视觉效果：

module powerbi.extensibility.visual {
    "use strict";
    export class Visual implements IVisual {
        private host: IVisualHost;
        private svg: d3.Selection<SVGElement>;
        private div: d3.Selection<SVGElement>;
        private container: d3.Selection<SVGElement>;
        private json = JSON.parse((<any>window).jsonData);  

        constructor(options: VisualConstructorOptions) {

            this.svg = d3.select(options.element)
            .append('svg');
            this.container = this.svg.append("g")
                    .classed('container', true);
        }


        public update(options: VisualUpdateOptions) {
            let width: number = options.viewport.width; 
            let height: number = options.viewport.height;

            // D3 Projection
            var projection = d3.geo.albersUsa()
                   .translate([width/2, height/2])    // translate to center of screen
                   .scale(1000);          // scale things down so see entire US

// Define path generator
            var path = d3.geo.path()               // path generator that will convert GeoJSON to SVG paths
                .projection(projection);  // tell path generator to use albersUsa projection

//Create SVG element and append map to the SVG
            this.svg.attr({
                width: width,
                height: height
            });

            this.svg.selectAll("path")
                .data(this.json.features)
                .enter()
                .append("path")
                .attr("d", path)
                .style("stroke", "#fff")
                .style("stroke-width", "1")
        }
    }
}

视觉是空白的。控制台中没有错误。我曾希望使用以下命令进行调试：https://microsoft.github.io/PowerBI-visuals/docs/how-to-guide/how-to-debug/，但是那里提供的代码产生了很多错误，并且我相信基于该页面的评论已弃用了该代码。

谢谢！

Answer 1

您是否已将数据添加到数据桶中？没有数据集，Power BI不会调用视觉对象的更新方法。

尝试检查视觉对象的DOM树，以确保在执行视觉对象的更新方法后已创建svg元素或路径。

在Power BI中创建地图自定义视觉

1 个答案: