obsidian-webpage-export icon indicating copy to clipboard operation
obsidian-webpage-export copied to clipboard

How to change the font color of nodes in the relationship graph?

Open Ryanu9 opened this issue 9 months ago • 7 comments

As shown in the picture, the default font is white in light mode, and I can barely see it.

Image

Ryanu9 avatar Feb 23 '25 12:02 Ryanu9

Hi sorry for the late reply, this is probably a bug but you need to provide me with more information. If you go into the plugin settings there is a button to copy some debug information. If you could use that button and paste the info into a comment here that would be useful.

Also make sure you are using the beta version (info in the readme)

KosmosisDire avatar Mar 10 '25 07:03 KosmosisDire

Log: [INFO] Including stylesheet: css-settings-manager [INFO] Could not check for update [INFO] Failed to fetch app://local/D:/Documents/Pictures/三体智子.jpg {} [INFO] Failed to fetch app://local/D:/Documents/Pictures/Unsplash/UnsplashTemp.jpg {}

Settings: settingsVersion --------- 1.8.03 makeOfflineCompatible false inlineAssets ------------ false includePluginCSS 8 plugins included includeSvelteCSS -------- true titleProperty title customHeadContentPath --- faviconPath C:\\Users\Administrator\Pictures\favicon_logosc\favicon.png documentWidth ----------- 50em sidebarWidth 20em minOutlineCollapse ------ 2 startOutlineCollapsed false allowFoldingHeadings ---- true allowFoldingLists true allowResizingSidebars --- true logLevel warning minifyHTML -------------- true makeNamesWebStyle true onlyExportModified ------ true deleteOldFiles false addThemeToggle ---------- true addOutline true addFileNav -------------- true addSearchBar true addGraphView ------------ true addTitle true addRSSFeed -------------- true siteURL https://www.c1trus.top/ authorName -------------- C1trus vaultTitle C1trus exportPreset ------------ website openAfterExport false graphAttractionForce ---- 1 graphLinkLength 10 graphRepulsionForce ----- 150 graphCentralForce 3 graphEdgePruning -------- 100 graphMinNodeSize 3 graphMaxNodeSize -------- 7 showDefaultTreeIcons true emojiStyle -------------- Native defaultFileIcon lucide//file defaultFolderIcon ------- lucide//folder defaultMediaIcon lucide//file-image exportPath -------------- E:\\notes filesToExport 164 headCodes --------------- \n\n\n\n\n\n\n\n\n defaultTheme light isDefaultLightTheme ----- true showComments true showPageHeader ---------- true showPageFooter true showRSSFeed ------------- true showScrollToTop true walineServerURL --------- https://waline.c1trus.top/ statisticalCodes
showFileNumber ---------- true useBartenderPlugin true useFileColorPlugin ------ true

Enabled Plugins: Templater MetaEdit Dataview Recent Files Calendar Advanced URI Contextual Typography Sortable Periodic Notes Kanban QuickAdd Buttons floating toc Linter Dynamic Highlights Style Settings Excalidraw File Explorer Note Count 增强编辑 AttachFlow Image Toolkit Image auto upload Table Generator Table to CSV Exporter Easy Typing Global Search and Replace I18N Omnisearch Commander Local Images Plus Admonition Number Headings Better Export PDF Editing Toolbar Enhancing Export Clever Search Advanced Tables Webpage HTML Export Hover Editor Bartender Iconize Force note view mode Banners Homepage Advanced Canvas Auto Link Title

Ryanu9 avatar Mar 11 '25 04:03 Ryanu9

Thanks, I think you would likely have more luck using the beta version of the plugin. It is much more stable, has more features, and has a more proper web api that you can use for your custom scripts if you like. I hope to release it soon as stable but I have been quite busy recently. I am fairly sure that if you update it this issue will be fixed. It looks like you have put in a lot of work on your custom scripts though!

KosmosisDire avatar Mar 11 '25 06:03 KosmosisDire

Thank you, I will give it a try. Your plugin is really great! I hope you can add some new features, such as comments and image click-to-zoom

Ryanu9 avatar Mar 13 '25 13:03 Ryanu9

I am using the latest beta and facing the same issue, any workarounds?

sameert89 avatar Jul 02 '25 21:07 sameert89

I am using the latest beta and facing the same issue, any workarounds?

What theme are you using? Try the default theme, clear the cache (or delete your whole export), and re-export everything.does this solve it or not?

KosmosisDire avatar Jul 02 '25 21:07 KosmosisDire

I am using Topaz, it could be the theme, it works fine on the default theme. I made a monkey patch for topaz if someone needs it

<script>
(function() {
    const observer = new MutationObserver(mutations => {
        for (const m of mutations) {
            if (m.type === 'attributes' && m.attributeName === 'class') {
                const isLight = document.body.classList.contains('theme-light');
                const isDark = document.body.classList.contains('theme-dark');

                if (isLight || isDark) {
                    const colors = isLight ? {
                        background: 0xFFFFFF,
                        link: 0xAAAAAA,
                        node: 0X66CCFF,
                        outline: 0xAAAAAA,
                        text: 0x000000,
                        accent: 0x4023AA
                    } : {
                        background: 0x000000, // <- text is rounded inverse of this, so this controls node label colors
                        link: 0xAAAAAA,
                        node: 0xCCCCCC,
                        outline: 0xAAAAAA,
                        text: 0x000000, // <- has nothing to do with pixi text labels
                        accent: 0x4023AA
                    };

                    if (typeof graphRenderer !== 'undefined' && graphRenderer.worker) {
                        setTimeout(() => {
                            graphRenderer.worker.postMessage({
                                type: 'update_colors',
                                colors
                            });
                        }, 500); 
                    }
                }
            }
        }
    });
    observer.observe(document.body, { attributes: true, attributeFilter: ['class'] });
})();
</script>

This html can be linked in custom head content option of the plugin and can also be used to customize the graph colors if anyone wants it.

Btw Awesome Plugin, the source is also super readable and easy to tinker with.

sameert89 avatar Jul 02 '25 23:07 sameert89