首页 > 解决方案 > 嵌入在 C# WebBrowser 控件中的谷歌地图显示没有缩放/卫星按钮

问题描述

我在 System.Windows.Forms.WebBrowser 控件中嵌入了 Google 地图。直到最近它工作得很好。但现在地图类型按钮(路线图、卫星等)和缩放按钮不再显示:

在此处输入图像描述

直接在 IE11 中打开相同的 HTML 文件没有问题(这里)。

我正在执行以下操作以强制嵌入式 IE 不使用兼容模式:

我正在使用 .NET Framework 4.5.2。一个重现问题的小示例项目在这里:https ://github.com/nharrer/gmap-dotnet-example

这是 HTML 的一部分:

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Testpage</title>

    ....
</head>

<body>
    <div id="map"></div>
    <script>
        function initMap() {
            map = new google.maps.Map(document.getElementById('map'), {
                zoom: 4,
                center: { lat: 48.2081743, lng: 16.37381890000006 }
            });

            var marker = new google.maps.Marker({
                position: { lat: 48.2081743, lng: 16.37381890000006 },
                map: map,
                title: 'Mark1!'
            });

            var marker2 = new google.maps.Marker({
                position: { lat: 50.2081743, lng: 12.37381890000006 },
                map: map,
                title: 'Mark2!'
            });
        }
    </script>

    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAR1yYbZk62bSF0-QWNfVm5FWE_Jpv-ExA&callback=initMap"></script>
</body>

</html>

这是设置兼容性注册表值并初始化 WebBrowser 控件的 c# 代码:

public TestForm()
        {
            FixBrowserEmulation();

            InitializeComponent();

            bool designTime = LicenseManager.UsageMode == LicenseUsageMode.Designtime;
            if (!designTime) {
                mapBrowser.ScriptErrorsSuppressed = false;

                string docFile = Path.Combine(Application.StartupPath, "maptest.html");
                string documentText = File.ReadAllText(docFile);
                mapBrowser.DocumentText = documentText;
            }
        }

        // see: 
        // https://stackoverflow.com/questions/17922308/use-latest-version-of-internet-explorer-in-the-webbrowser-control
        // https://blog.malwarebytes.com/101/2016/01/a-brief-guide-to-feature_browser_emulation/
        private static void FixBrowserEmulation()
        {
            var appName = Process.GetCurrentProcess().ProcessName + ".exe";

            // 11000 (0x2AF8) - Internet Explorer 11. Webpages containing standards-based !DOCTYPE directives are displayed 
            // in IE11 edge mode. Default value for IE11.
            int? mode = 0x2AF8;

            try {
                const string regpath = @"SOFTWARE\\Microsoft\\Internet Explorer\\Main\\FeatureControl\\FEATURE_BROWSER_EMULATION";
                using (RegistryKey regkey = Registry.CurrentUser.CreateSubKey(regpath)) {
                    if (regkey == null) {
                        Debug.WriteLine("Error: Can not access: " + @"HKEY_CURRENT_USER\\" + regpath);
                        return;
                    }

                    var currentMode = regkey.GetValue(appName) as int?;
                    if (currentMode == mode) {
                        Debug.WriteLine("Info: FEATURE_BROWSER_EMULATION is correct.");
                        return;
                    }

                    regkey.SetValue(appName, mode, RegistryValueKind.DWord);

                    currentMode = regkey.GetValue(appName) as int?;
                    if (currentMode == mode) {
                        Debug.WriteLine("Info: FEATURE_BROWSER_EMULATION set to " + currentMode);
                    } else {
                        Debug.WriteLine("Info: FEATURE_BROWSER_EMULATION modification failed. Current value: " + currentMode);
                    }
                }
            } catch (Exception ex) {
                Debug.WriteLine(ex.Message);
            }
        }

标签: c#google-maps

解决方案


可能为时已晚,但如果有人偶然发现提到的缩放和街景控件消失的问题,请确保您将控件AllowNavigation属性WebBrowser设置为True. 所以在这种情况下你应该做

mapBrowser.AllowNavigation = true;

推荐阅读