search

phibr0 / obsidian-charts

Charts - Obsidian Plugin | Create editable, interactive and animated Charts in Obsidian via Chart.js
https://charts.phib.ro/
GNU Affero General Public License v3.0
546 stars 25 forks source link

[Bug]: Charts show black labels in dark mode #86

Open AbcAeffchen opened 1 year ago

AbcAeffchen commented 1 year ago

Describe the bug

I use the API to view data collected using dataview as charts. Works perfectly fine but the axis and labels are all colored black which is unreadable when in dark mode.

image

Relevant errors (if available)

No response

Steps to reproduce

All charts generated in a dataviewjs code block as well as in chart code blocks seem to have this issue. (provided an example in chart code block, but actually I need a solution for the dataviewjs case)

Expected Behavior

The font and axis color should switch to white in dark mode or have an option to set the color explicitly. An other option would be to add an optional solid white background to the whole chart.

Additional context

I could not find a setting where to change the font and axis color explicitly. I looked into Chart.js, since this seems to be the underlying library. However, all I could find was to set a Charts.options... parameter but the Charts object is not available within dataviewjs code blocks.

Code

type: bar
labels: [A,B,C,D,E]
series:
  - title: test1
    data: [5,3,7,8,1]
  - title: test2
    data: [1,2,3,4,5]
tension: 0.23
width: 85%
labelColors: false
fill: false
beginAtZero: true

Operating system

Linux

rncix commented 11 months ago

I had this problem, it went away when I removed all code snippets from my obsidian directory so seems like there's some code in there overriding the font color of the chart. Try that and see?

Edit: The CSS line was this that was causing it for me:

--text-normal: