# Converting HTTPs link images/icons to Base 64 in Power BI

If you have a column of images/icons in https links format like below:

<figure><img src="https://382510089-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIuuIZWiXEx25eV75hmmJ%2Fuploads%2FcCG1YRvD2tvyBQITOWyN%2Fimage.png?alt=media&#x26;token=4e181067-2f67-4776-a2ce-4b1e2ce9f14c" alt="" width="230"><figcaption><p>Image 1: Column of https links for images/icons</p></figcaption></figure>

Then you can convert it to base 64 URL format, which is the acceptable format by the xViz Performance Flow visual (as it is certified):

<figure><img src="https://382510089-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIuuIZWiXEx25eV75hmmJ%2Fuploads%2FgbOAEC3LuDVoqwqJUgLP%2Fimage.png?alt=media&#x26;token=94d7f557-388d-4fb1-895d-83defd24af12" alt="" width="325"><figcaption><p>Image 2: Columns of Base 64 URLs for images/icons</p></figcaption></figure>

### Steps to be followed in Transform Editor/Power Query:

#### Step 1: Create a Custom Function in your Power BI report -> Transform Data:

1. Home → New Source → Blank Query<br>

<figure><img src="https://382510089-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIuuIZWiXEx25eV75hmmJ%2Fuploads%2FxM47BqHDpImViHYEBJCY%2Fimage.png?alt=media&#x26;token=13a4205f-ee32-4eb5-8323-2a3e5fa4c97d" alt="" width="190"><figcaption><p>Image 3: Create a New Blank Query</p></figcaption></figure>

2. Change the name of the query to Query1 to *ImgtoBase64Url* and Click on Advanced Editor

<figure><img src="https://382510089-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIuuIZWiXEx25eV75hmmJ%2Fuploads%2FozdHlEtlrcXVXITiiawI%2Fimage.png?alt=media&#x26;token=4bd55b35-6fbb-429c-9a68-471dcdc3338b" alt="" width="563"><figcaption><p>Image 4: Advanced Editor option</p></figcaption></figure>

3. Paste the below code and Click on Done:

```powerquery
let
    Source = (ImageUrl as text) as text =>
let
    BinaryContent = Web.Contents(ImageUrl),
    Base64 = "data:image/jpeg;base64, " & Binary.ToText(BinaryContent, BinaryEncoding.Base64)
in
    Base64
in
    Source
```

**Note:** The prefix of "data:image/jpeg;base64, " must be adjusted as per the image extension, i.e. replace the "jpeg" with the extension of the image that you are using (eg: png, etc.)

#### Step 2: Invoke the custom function in the data:

1. Add Column → Invoke Custom Function

<figure><img src="https://382510089-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIuuIZWiXEx25eV75hmmJ%2Fuploads%2FRwPNKRMJsMCkjuRIGRdF%2Fimage.png?alt=media&#x26;token=a77742fe-9da3-41b3-ac2b-783964ddb562" alt="" width="367"><figcaption><p>Image 5: Invoke Custom Function option</p></figcaption></figure>

2. Add the following details in the popup:
   1. Provide a name for the new column
   2. Select the function query name “*ImgtoBase64Url*”
   3. Select the column with Images URL

<figure><img src="https://382510089-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIuuIZWiXEx25eV75hmmJ%2Fuploads%2F6ut9pcW14tcCuSoK8xH6%2Fimage.png?alt=media&#x26;token=751eef22-4b14-41e7-8727-f98f8194553e" alt=""><figcaption><p>Figure 2: Invoke Custom Function dialog box</p></figcaption></figure>

**Result:** This will result in a new column named "Image" which will contain the Base 64 URLs. Use this column in the xViz Performance Flow visual.&#x20;

Here is an **example** report file:&#x20;

{% file src="<https://382510089-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIuuIZWiXEx25eV75hmmJ%2Fuploads%2F0zwu2ne7ucdhmMCFTqhk%2FxViz%20Performance%20Flow%20-%20Https%20to%20Base%2064%20Image-Icons.pbix?alt=media&token=99236079-887b-4303-a175-0ea38cc65789>" %}

{% hint style="info" %}
If the images you are referring are of high resolution which results in over 33,000 characters in base 64 format, then you might see only partial image rendering because of the character limit in Power BI. Check out this page for the solution - [handling-long-base-64-urls-in-power-bi](https://docs.xviz.com/performance-management/display-data-in-the-cards/images/handling-long-base-64-urls-in-power-bi "mention")
{% endhint %}
