Shrinking map markers

Quzar

I find that the marker feature in maps creates markers that are too big. I tried my hand at some custom CSS for it, but I think I'm not impacting the correct object. I'd appreciate any tips or hints on how to get this done. Thank you!

Comments

  • Bortas
    Bortas
    Posts: 645

    Man, I don't think you can, I think its all part of the google engine.

    I really wish you could too - I'd love to put a border on my markers, so they don't bleed together so badly.

    -bort

  • cgregory
    cgregory
    Posts: 780

    I figured I'd fool around with it. I've had some success modifying the size of the marker but the issue is I modified the size of all images in the map and since google maps are made up of multiple small images pasted together it created an amusing result and certainly not one that you want.

    .campaign-map-index #selected-map-container img{

    height: 20px!important;

    width: 20px!important;

    }

    The styles for the marker images are inline styles, so whatever you do you'll need to use !important in order to get the css to do anything.

     

    They are among us!

    image

                       XCom: Defiance - Campaign of the Month November 2016

     

     

  • Quzar
    Posts: 4

    Bortas - You should be able to add borders using my code below as a template.

    cgregory - Thank you for the tip with 'important''. I've never used css so I didn't even notice when the adjustments weren't being applied. I got it to work with the code below.

     


    /* Adjusting the size of Map Marker Icons from W:40 H:50 to 20x25 - Quzar*/
    img[src*="map_marker_icons"]
    {
    width:20px!important;
    height:25px!important;
    left:10px!important;
    top:25px!important;
    position:relative!important;
    }

     

  • cgregory
    cgregory
    Posts: 780

    Nice work Quzar. Never thought about trying img[src*="map_maker_icons] as the identifier.

    They are among us!

    image

                       XCom: Defiance - Campaign of the Month November 2016

     

     

  • Bortas
    Bortas
    Posts: 645

    Quzar - you are the man! Great identifier locator!

    -bort

  • cgregory
    cgregory
    Posts: 780

    Quzar may be great, but at least i can claim to be !important   wink

    They are among us!

    image

                       XCom: Defiance - Campaign of the Month November 2016

     

     

  • twiggyleaf
    twiggyleaf
    Posts: 2,011

    I have now implemented this.  Thanks Dudes!

    "I met a traveller from an antique land....."

    CotM May 2016: Mysteria: set in Wolfgang Baur’s MIDGARD.

    Previous CotM Aug 2012: Shimring: High Level Multiplanar Campaign

    Inner Council Member

  • Ghandi
    Ghandi
    Posts: 7

    Hey everyone, this thread was super helpful for me too. I also found a way to finally line up the divs that activate the mouse-over and draggability for the markers with the images.

    Combine Quzar's image resize withe the follwoing:

    /*Adjust Map Marker Div Locations by Ghandi*/

    .gm-style div:nth-child(1) div:nth-child(4) div:nth-child(3) div.gmnoprint

    {

    width:20px!important;

    height:25px!important;

    margin-top:25px!important;

    margin-left:10px!important;

    }

Sign In or Register to comment.

April 2024
Season of Strife

Read the feature post on the blog
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