How to display static map on card using GDK?

问题:

In Mirror API we can use something like:

<img src="glass://map?w=240&h=360&marker=0;42.369590,
      -71.107132&marker=1;42.36254,-71.08726&polyline=;42.36254,
      -71.08726,42.36297,-71.09364,42.36579,-71.09208,42.3697,
      -71.102,42.37105,-71.10104,42.37067,-71.1001,42.36561,
      -71.10406,42.36838,-71.10878,42.36968,-71.10703"
      height="360" width="240">

And it renders nice Glass-optimized map on card.

How to do the same thing in Activity using GDK?

回答1:

I ended up writing this method which displays user's current location as blue dot and venue location as red dot:

public static String getMapUrl(double latitude, double longitude, double currentLat, double currentLon, int width, int height) {
        try {
            String raw = "https://maps.googleapis.com/maps/api/staticmap?sensor=false&size=" + width + "x" + height +
                "&style=feature:all|element:all|saturation:-100|lightness:-25|gamma:0.5|visibility:simplified" +
                "&style=feature:roads|element:geometry&style=feature:landscape|element:geometry|lightness:-25" +
                "&markers=icon:" + URLEncoder.encode("http://mirror-api.appspot.com/glass/images/map_dot.png",
                "UTF-8") + "|shadow:false|" + currentLat + "," + "" + currentLon+"&markers=color:0xF7594A|" + latitude + "," + longitude;
            return raw.replace("|", "%7C");
        } catch (UnsupportedEncodingException e) {
            return null;
        }
    }

It looks like this:

回答2:

My version of the solution:

public static String getMapUrl(double latitude, double longitude, int width, int height) {
    String raw = "https://maps.googleapis.com/maps/api/staticmap?" +
            "sensor=false" +
            "&zoom=15" +
            "&size=" + width/2 + "x" + height/2 +
            "&scale=2" +
            "&style=visibility:simplified" +
            "&style=feature:administrative|visibility:off" +
            "&style=feature:landscape|element:geometry|color:0x303030" +
            "&style=feature:poi|visibility:off" +
            "&style=feature:poi.park|element:geometry|color:0x0C320D|visibility:on" +
            "&style=feature:road|element:labels.text|color:0xFFFFFF" +
            "&style=feature:road.arterial|element:geometry|color:0x737373" +
            "&style=feature:road.highway|element:geometry|color:0x737373" +
            "&style=feature:road.highway.controlled_access|element:geometry|color:0x955715" +
            "&style=feature:road.local|element:geometry|color:0x5A5A5A" +
            "&style=feature:transit|visibility:off" +
            "&style=feature:water|element:geometry|color:0x030427" +
            "&style=feature:water|element:labels|visibility:off" +
            "&markers=color:red|" + latitude + "," + longitude;
    return raw.replace("|", "%7C");
}