Limiter functionalities for the maps

NimrodYanai
NimrodYanai

Working with the maps, I came across some functionalities that should really be added:

1. Better map marker groups. The current groups don't make much sense (to me, at least). There is a tower under monuments, but a lighthouse is under the general. The groups need to be clearer, like "buildings", "general", "signs" etc. the "natural disasters" one is the best one.

2. Custom map markers. We need a way to use PNG images from the media as markers.

3. Expanders for markers. For examples if I want to only see buildings, or more specific expanders for inns for examples. I use the "keys" map marker for inns and taverns, so if I could limit by that map marker, I will essentially be showing only the inns.

Comments

  • thaen
    thaen
    Posts: 663

    1.  I think the tower is a specific tower of a specific country ... though I don't know which.  Those are all national monuments of different nations, I think.  There aren't that many of these map marker groups, and a member can browse through all of them pretty quick, so it doesn't seem like much benefit to moving them around compared to other uses of dev time.

    2. There is a way already!

    https://forums.obsidianportal.com/discussion/5855/custom-map-markers/p1

    3.  I'm not totally following.  What do you mean by "Expanders"?  Is "expanders" the same as "filter" or "limit"?

    Obsidian Portal Developer

  • NimrodYanai
    NimrodYanai
    Posts: 71

    1. Possibly. I just think the current groups are not really that comfortable :)

    2. :O Cool! That system limits me to just the existing markers, but I supposed those should be enough! I can use the space ones instead for my fantasy campaigns. Should be enough!

    3. Expander is the exact opposite of the limiters we talked about for tags, it uses the original functionality you had - it uses OR instead of AND for the boolean operator.

    So for example if I press on the markers for Inns it will display only markers that have that description, and then if I also press the Blacksmith markers it will show all the inns and all the blacksmiths.

    That way I can only see those markers that I want to see.



    Here is an example of when it will be useful:

    As you can see, this map has A LOT of markers on it in relatively close proximity.

    In this case, it would be very useful to choose to only show markers of a certain type.

    Maybe it will be possible to add tags to markers as well, and then have the expanders for them on the maps page?

  • NimrodYanai
    NimrodYanai
    Posts: 71

    Also, with that system, I can only choose a custom image one marker at a time instead of by type, so I can't have a custom image for types like "Inns" or "Store" etc.

    Is there a class that defines each marker type? I assume there is, since the current code knows how to put images on specific markers, so there should be something that connects them.

  • thaen
    thaen
    Posts: 663

    1.  Ha!  Noted.

    3.  I think I follow now ... you want a way to be able to show/hide the map markers as a group, and also tagging.  I'll add that Feature Request to the list.  Thanks!

    2.  I think you could indeed have a custom image by type, you would just need to make sure that the Title for all the map markers of the same type had something you could key off of.  So for example, you could have all of your Inn map markers have a title that ends in " ... (Inn)".  Then in the css, you would have something like:


    div[title$='(Inn)']

    I didn't test that, but that's the idea.

    Is there a class that defines each marker type? I assume there is, since the current code knows how to put images on specific markers, so there should be something that connects them.

    There actually aren't any classes on the divs.  I think the javascript is building the divs and then inserting them directly into the DOM.  They're kind of hard to find digging in the html, but here's a screenshot of the one that is being hidden.

    image

     

    Note that you should have infinite markers that you can override because the markers file names are created based on the color.  So the "black square" from my example is "000000.png", since that's the color code for black.  If you used a "white square" instead, then it would be "ffffff.png".  (But I just tested that and it becomes invisible on the white background of the Map Markers popup.)

    Obsidian Portal Developer

  • NimrodYanai
    NimrodYanai
    Posts: 71

    That is interesting!

    I didn't think of that. With the colors, it can basically be unlimited.

    The only issue is that now I need to have the images with the color in the background...

    I'll need to make some tests. Right now I have this code but my image isn't displaying. My guess is that it has to do with the image I am trying to use.


    /* Hide the default map marker images */
    div img[src^='/map_marker_icons/58/00ff15.png'] {
    display: none;
    }

    /* Set the image of a map marker based on the map marker's Title */
    div[title='Hissing Stones Bathhouse'] {
    background-image: url('https://static.thenounproject.com/png/1468757-200.png');
    }

     

  • NimrodYanai
    NimrodYanai
    Posts: 71

    Ok, I managed to get it working!

    Takes some work because I need to make an exact image with the same size and transparent background, but it works!

    image

  • thaen
    thaen
    Posts: 663

    Excellent!  Glad you got it working.

    HA!  I'm glad we don't have to figure out what categories to put some of those in.  : )

    Obsidian Portal Developer

  • NimrodYanai
    NimrodYanai
    Posts: 71

    Those are all businesses:

    Bed = inn/tavern

    Bathhouse = Bathhouse

    Woman = brothel

  • NimrodYanai
    NimrodYanai
    Posts: 71 edited August 10

    BTW - there is actually an easier, better way to accomplish this. You do not need to set the CSS to display:none, you can directly replace the image, like so:

    div img[src^='/map_marker_icons/58/00ff17.png'] {

    content:url("https://www.myurl.com";);

    }

    The advantage of this system is that the image will actually display in the marker creator:

    image

     

    Whereas in the previous system, the original image in the creator will be blank (as it is set to display:none):

    image

     

    Edit 1: And then you can just remove the second part of the code (where you originally set the image) completely. So these three lines of code are all you need.

    Edit 2: AND, because I am replacing ALL the instances of a specific type with a specific color, I no longer need to use the titles at all. I can choose to replace ALL types of icons of a specific type and color with a custom one, regardless of what the title is.
    Post edited by NimrodYanai on
  • thaen
    thaen
    Posts: 663

    Oh wow!  That's so much better.  I didn't realize you could use "content" like that on an img tag.  That's awesome!

    I'm going to update the original post and credit you.  Thank you!

    Obsidian Portal Developer

Sign In or Register to comment.

Campaign of the Month
October 2021

Hogwarts and the Magic of the Founders


Read the feature post on the blog!
Or return to Obsidian Portal!

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Discussions