วีดีโอ

Sorry, I've moved it. See github.com/avatorl/PowerBI-IBCS/tree/main/matrix-visual-ibcs

I replaced the base64 images with external urls but those images would not load :(

​@@DAXJutsu i have same problem. Don't you find a solution? External images shows by url only by itself, but not inside in SVG tag

@@alexeyfirsankov5235 seems like a Power BI problem. I have no problem viewing an SVG containing an external image url in an SVG viewer.

@@DAXJutsu Well, propably it's not possible to do it standart table visual, unfortunately. But it works in HTML content custom viz

Not possible. At least for now. Table, Matrix, Card (new) visuals block mouse events in SVG images... For clickable maps, use IconMap or Deneb visuals.

Thanks. Regarding the sound: I'm sorry if it's not very good, I probably shouldn't record and edit videos in the middle of the night.

@power-of-bi What could help is to create the audio stream separately. Typically a smartphone with a recording app put in front on your desk pointing to your mouth would give sufficient results. In video post production, just put this in as a separate audio layer. Works typically totally reliable and you do not need any noise cancelling / auto-ducking features in your video editing software which can also give these odd results. Thanks for the otherwise great content!! 🙏🙏

@@businessinsights_AlexRobe Thank you! The audio is from a better microphone than any smartphone has, but I missed an issue with mic settings... I believe I've already fixed the problem. Publishing a new video today...

Andrzej, you showed how to work with two datasets that originate from the same source. I wonder is it possible to work with several dataset that are not originated from the same root data source? If yes it would be great if you covered how to in your future videos.

Thanks. Really great question. Well, there is no a single way to create a visualization. It's perfectly OK to use the same data source for the rectangles and for the text labels. And in many cases there will be no meaningful difference. In this example you can replace {"data": "rect-ac"} with {"data": "table"} and then remove 'datum.' from the "field" properties within "encode", because as you have mentioned we don't use fields generated by Vega for the "rect-ac" table (such as xc, y, width, height), we still use the original "table" fields stored in the datum field of the 'rect-ac' table. Or you can keep {"data": "rect-ac"}, remove the "scale" and "band" properties and use "field: "x" instead of "field": "datum.month", "field": "y" instead of "field": "datum.AC" and "field": "datum.AC" for the "text". In more advanced visualizations using a table like "rect-ac" (a table created by adding "name" property to a mark) will be useful to avoid repeating some heavy calculations multiple times (assuming there was some tricky formula to calculate "x", "y", "width", "height", "fill" or any other property of one mark (such as "rect-ac") and you need the same for the other mark (such as "text" for the text label) . In this case it doesn't really matter. Whatever piece of code was easier to copy paste from the previously created marks and modify. Thanks again. I'll talk about this in the future videos.

Thank you very much for your clarification, Andrzej! These step-by-step videos with detailed explanations are very helpful.

This will be a subject of the next video. Thanks.

th-cam.com/video/oun2V09Dbt8/w-d-xo.html

Thanks. Import the .csv data file into Power BI and load into Deneb "dataset" deneb-viz.github.io/dataset. I'll make a video.

th-cam.com/video/oun2V09Dbt8/w-d-xo.html

Thank you for the comment

Thank you for the comment. Such comments encourage me to make more videos.

Vega visualizations (including interactive and animated ones) can be created using Vega JSON only. No JavaScript required. Basic JS may be required to embed Vega visualizations into a web page with some additional functionality, for example, Vega examples on my website are being generated using Vega JSON code stored in my Github repository. That required a few rows of JS code.

@@power-of-bi Great. Thank You. Hoping to learn a lot from you.

Thanks. I'll do that soon. I'll start from a simple example (basic column chart). Then, in the following videos will go through other more and more advanced examples.

th-cam.com/video/HvIxqEC2_TY/w-d-xo.html

For some reason most people prefer Vega-Lite (less code?). From my point of view (but maybe it's skewed by the fact that I already know Vega) Vega is more descriptive and straightforward. I mean, look at the Vega mark. It's clearly describes what you see on the screen ("rect"), what data table it is based on ("table"), where it starts and where it ends (x, y, y2 and width properties), how values are being projected onto the plot (using xscale and yscale) and what color it is filled with ("steelblue"). Vega: "marks": [ { "type": "rect", "from": {"data":"table"}, "encode": { "enter": { "x": {"scale": "xscale", "field": "category"}, "width": {"scale": "xscale", "band": 1}, "y": {"scale": "yscale", "field": "amount"}, "y2": {"scale": "yscale", "value": 0}, "fill": {"value": "steelblue"} } } ] And Vega-Lite? "mark": "bar", "encoding": { "x": {"field": "a", "type": "nominal", "axis": {"labelAngle": 0}}, "y": {"field": "b", "type": "quantitative"} } What? Everything is based on default setting applied behind the scene.

@@power-of-bi Very good example to appreciate the difference. Thank you.

An HTML table formatted and animated using CSS, then embedded into an SVG namespace using the foreignObject element. This was implemented in the New Card visual.

Share a video how to prepare this pls