谷歌地图设置头像用户答案

【问题标题】：Google maps setting avatar user谷歌地图设置头像用户
【发布时间】：2016-02-10 23:47:27
【问题描述】：

美好的一天。

我需要 Google 地图选项方面的帮助。

我的网站被 Google 地图屏蔽了。如果他在 Google+ (gmail) 中注册，该地图有显示头像用户的选项。头像有直径约 32px 的圆形（示例中如何：https://developers.google.com/maps/documentation/javascript/examples/map-coordinates?hl=ru）。

我希望头像为正方形，大小为 60x60px，边距为 70px。

怎么做？

提前谢谢！

谷歌地图上的代码头像：

     <iframe src="https://www.google.com/maps/api/js/widget?pb=!1m2!1u22!2s12a!2sru#WzEsMTUxXQ.."
        frameborder="0" allowtransparency="true" scrolling="no"
        style="border: 0px; overflow: hidden; position: absolute; right: 0px; visibility: visible; width: 37px; height: 37px;">

    <html jstcache="0">
    <head>
        <link id="__2__" type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700">
        <style type="text/css">
            html, body {
                height: 100%;
                margin: 0;
                padding: 0;
            }
        </style>
        <style>div.login-control{color:white;font-family:Roboto,Arial;font-size:11px;font-weight:500}div.login{border-radius:2px;background-color:#5f84f2;padding:4px 8px 4px 8px;cursor:pointer}.login-control .tooltip-anchor{color:#5B5B5B;display:inline;font-family:Roboto,Arial;font-size:13px;font-weight:normal;-moz-user-select:text;-webkit-user-select:text;-ms-user-select:text;user-select:text;width:50%}.login-control .tooltip-content{background-color:white;font-weight:normal;right:0px}div.login a:link{text-decoration:none;color:inherit}div.login a:visited{color:inherit}div.login a:hover{text-decoration:underline}div.profile-photo{border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,0.2);width:32px;height:32px;overflow:hidden}div.profile-photo-light{background-color:white}div.profile-photo-light div{color:black}div.profile-photo-dark{background-color:black}div.profile-photo-dark:hover{background-color:white;color:black}div.profile-photo img{float:right;width:32px;height:32px}.tooltip-anchor{width:100%;position:relative;float:right;z-index:1}.tooltip-anchor>.tooltip-tip-inner{background-color:transparent;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid white;height:0;left:-8px;position:absolute;top:5px;width:0;z-index:1}.tooltip-content{border-radius:2px;box-shadow:0 2px 4px rgba(0,0,0,0.2);display:inline-block;line-height:100%;padding:10px 11px 9px 11px;position:absolute;margin:0;top:10px;white-space:nowrap}.tooltip-content a{color:#3a84df;text-decoration:none}.tooltip-content a:hover{text-decoration:underline}.tooltip-content .user-email,.tooltip-content .user-name{padding-right:12px}.sign-in-explanatory-text{margin-bottom:6px}.tooltip-content a{overflow:hidden}.g-logo{background-image:url(https://maps.gstatic.com/mapfiles/api-3/images/white_google_icon.png);background-size:14px 12px;display:inline-block;height:12px;padding-right:6px;vertical-align:middle;width:8px}.gm-china .g-logo{background-image:url(http://maps.gstatic.cn/mapfiles/api-3/images/white_google_icon.png)}@media (-webkit-min-device-pixel-ratio:1.2),(min-resolution:1.2dppx),(min-resolution:116dpi){.g-logo{background-image:url(https://maps.gstatic.com/mapfiles/api-3/images/white_google_icon_hdpi.png)}.gm-china .g-logo{background-image:url(http://maps.gstatic.cn/mapfiles/api-3/images/white_google_icon_hdpi.png)}}.sprite-sheet{background-image:url(https://maps.gstatic.com/mapfiles/api-3/images/signed_in_api_icons2.png);background-size:100px 50px}.gm-china .sprite-sheet{background-image:url(http://maps.gstatic.cn/mapfiles/embed/images/signed_in_api_icons2.png)}@media (-webkit-min-device-pixel-ratio:1.2),(min-resolution:1.2dppx),(min-resolution:116dpi){.sprite-sheet{background-image:url(https://maps.gstatic.com/mapfiles/api-3/images/signed_in_api_icons2_hdpi.png);background-size:100px 50px}.gm-china .sprite-sheet{background-image:url(http://maps.gstatic.cn/mapfiles/embed/images/signed_in_api_icons2_hdpi.png)}}</style>
    </head>
    <body jstcache="0" style="overflow: hidden;">
    <script>
        window.parent.frames['gm-master'].initWidget(window);
    </script>
    <div jstcache="0" style="position: absolute; top: 0px; right: 0px; width: 500px; height: 500px;">

        <div jstcache="0" style="position: absolute; top: 0px; right: 4px;">
            <div jstcache="69" class="login-control" jsaction="mouseenter:loginControl.resize;mouseleave:loginControl.resize;loginControl.resize">
                <div jstcache="2" jsaction="loginControl.login" class="login" style="display: none">
                    <a jstcache="3"> <span class="g-logo"> </span><span>Войти</span></a>
                </div>
                <div jstcache="4" class="profile-photo-light profile-photo" jsan="7.profile-photo-light,7.profile-photo">
                    <img jstcache="5" src="https://lh5.googleusercontent.com/-R_xY89bx5Ss/AAAAAAAAAAI/AAAAAAAAABg/xx_czODJ35o/s32-c/photo.jpg">
                </div>
                <div class="tooltip-anchor">
                    <div class="tooltip-tip-inner"></div>
                    <div class="tooltip-content">
                        <div jstcache="6" class="sign-in-explanatory-text" style="display: none">Войдите в свой аккаунт, и Google Карты станут ещё удобнее</div>
                        <div>
                            <a jstcache="7" class="" style="display: none"></a>
                            <a target="_blank" jstcache="8" href="https://plus.google.com/113092786366482147078?socpid=238&amp;socfid=maps_api_v3:logincontrol" class="user-name" jsan="7.user-name,8.href,0.target">+aleksandr</a>
                            <a target="blank_" jstcache="9" href="https://support.google.com/maps/?p=thirdpartymaps&amp;hl=ru" jsaction="mouseup:loginControl.learnMore">Подробнее...</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </body>
</html>

标签：

<img jstcache="5" src="https://lh5.googleusercontent.com/-R_xY89bx5Ss/AAAAAAAAAAI/AAAAAAAAABg/xx_czODJ35o/s32-c/photo.jpg">

【问题讨论】：

你必须尝试一下。
我必须如何展示尝试？我显示我的代码吗？但它是通常的连接代码谷歌地图。头像用户在 iframe 中，根据安全协议，我无法在 Jquery 中获取元素“div.profile-photo”。我无法在 Google 地图 API 中找到如何在地图上更改头像用户的大小。我必须向您展示什么？
显示一些代码、图像或类似的东西..

标签： google-maps google-maps-api-3

【解决方案1】：

目前无法自定义登录体验的 UI。我建议在 Google Maps API Issue Tracker 上打开描述您的用例的功能请求，以便团队可以开始跟踪对它的兴趣。

【讨论】：

感谢详细解答

【解决方案2】：

我知道这是 2 个月前的问题，并且已经选择了一个答案，但如果其他人正在寻找这个。您可以将 css 直接应用于 iframe 元素来实现边距。

这是我正在使用的代码

iframe[src^="https://www.google.com/maps/api/js/widget?"] {
    margin-top: 50px;
    margin-right: 52px;
}

How it looks

【讨论】：