excalidraw / excalidraw-vscode

Excalidraw for Visual Studio Code
https://marketplace.visualstudio.com/items?itemName=pomdtr.excalidraw-editor
MIT License
457 stars 55 forks source link

Transparent Background setting ignored in embedded png #108

Open christsven opened 11 months ago

christsven commented 11 months ago

Hello,

I am trying to use .excalidraw.png files in a markdown file with transparent backgrounds, but the auto export seems to ignore the option. Changing the other options works just fine, and the transparency option worked exactly the first time and after that it sadly kept the dark (or light) background. I couldn't reproduce the first successful export either, unfortunately, so I can't say why it did or what changed. It doesn't work with light or dark mode enabled.

Reinstalling the extension also didn't fix the problem. I am using the v3.6.1 of this extension. Visual Studio Code v1.83.1.

Just for reference, here is my settings.json:

{
    "excalidraw.image": {
      "exportScale": 1,
      "exportWithBackground": false,
      "exportWithDarkMode": true
    }
  }
ivansimunic commented 9 months ago

Facing the same problem, but on .excalidraw.svg files.

graf-semmel commented 7 months ago

I ran into the same issue but figured that it could be caused by VSCode itself or another extension. I am using Marp for my slides which has editor preview.

The settings

    "excalidraw.image": {
        "exportScale": 2,
        "exportWithBackground": true,
        "exportWithDarkMode": true
    }

The markdown

---
marp: true
theme: default
backgroundColor: yellow
class:
  - lead
  - invert
---

# Slide 1

![auto](test.excalidraw.svg)

The rendering result in VSCode

image

Marp allows to change the rendering styles directly through CSS.

---
marp: true
theme: default
backgroundColor: yellow
class:
  - lead
  - invert
---

<style>
img { 
  background: transparent;
}
</style>

# Slide 1

![auto](test.excalidraw.svg)

Now the image BG is transparent.

image
subnetz commented 6 months ago

I have the same problem.
The settings in settings.json (either workspace settings or user settings) gets ignored.

With the settings

  "excalidraw.theme": "dark",
  "excalidraw.image": {
    "exportScale": 1,
    "exportWithBackground": false,
    "exportWithDarkMode": true
  }

it gets exported with a dark background

arnaudsylvestre commented 6 months ago

A simple workaround : use exportBackground instead of exportWithBackground in your settings.json