Rymbrak / interactive-map

This extension for Visual Studio Code provides a webview for the use and creation of interactive maps with custom backgrounds based on Leaflet.
MIT License
1 stars 1 forks source link

[Feature request] Icons and colors #2

Open KosRud opened 1 month ago

KosRud commented 1 month ago

Suggestion:

Icons

In extension settings, a path to folder can be provided (supporting variables like ${workspaceFolder} and similar). Map markers can be assigned icons (svg, png) from this folder.

Colors

In extension settings, a path can be provided (supporting variables like ${workspaceFolder} and similar) to a JSON file that defines a color palette. This JSON file contains a dictionary where keys contain color names and values contain hex color as a string. Example:

{
    "yellow": "#FFFF88",
    "blue": "#8888FF"
}

Each marker has a drop-down selector to pick a color form the palette. If a color with such name is not available in the palette, it should say "(missing)" in red font after the color name and default to some fallback color. There is a "default" color option (i.e. do not use palette).

The "default" option is always displayed first, followed by palette colors. Palette colors should be presented either in the same order as they are defined in the JSON file, or sorted alphabetically. Sorting is convenient if you don't want to implement UI for re-ordering colors in the palette.

The icon and/or text within colored markers should be either black or white (whichever has better contrast with selected color). It is picked automatically based on chosen marker color.

Rymbrak commented 1 month ago

Thank you for the suggestion, I'll look into getting that implemented.

KosRud commented 1 month ago

You likely have seen it already, but on the off-chance that you didn't: https://github.com/javalent/obsidian-leaflet

You might find some ideas here (e.g. for UI).

Rymbrak commented 1 month ago

I'll take a look, thank you.

KosRud commented 1 month ago

This plugin for obsidian offers buttons to easily download icon packs:

https://florianwoelki.github.io/obsidian-iconize/guide/icon-packs.html

IMHO it would be convenient to have a similar option. To avoid clashes when extracting multiple packs into the same folder, icon folder should probably be scanned recursively (to support subfolders) and sorted based on full path to the icon (in the UI for picking icons).

These are my personal favorites from that list of icon packs:

Rymbrak commented 3 days ago

I've added the option to use custom SVGs. Currently, you need to put them in a folder inside the extension's icon folder. One of the next versions should come with a more convenient way of adding icons that doesn't get deleted on new versions, like choosing a folder manually as suggested. You can change the color for icons from within the JSON, I'll be adding a GUI in the next version. For the colors you can use any CSS valid format. I'm also looking into copying the custom icons directly to the interactive-map folder and use local paths for portability.