虚拟地球媒体中心插件

• 下载源码 - 17.9 KB
• 下载演示 - 80.1 KB

引言

在我们家里，微软 Windows Media Center Edition 的“我的图片”功能可能是最常用的功能了。我们有大量的数码照片，并且已经开始扫描我们的大部分幻灯片。经常在和朋友一起看幻灯片时，他们会问这些照片是从哪里拍的。通过结合地理编码的数码图像和 MSN 的 Virtual Earth 基于网络的地图控件，现在可以将其直接在 Media Center 中显示在地图上。

Virtual Earth 在 Media Center 中的第二个用途是将其用作浏览世界的数字地图集。

实现

实现包括两个主要部分。第一部分是创建一个在 Media Center 中运行良好的 Virtual Earth 网页，这主要包括处理 Media Center 遥控器按键并将其映射到相关的 Virtual Earth 地图控件方法。第二部分是读取图像文件中的纬度和经度坐标的代码。

基本的 Virtual Earth 页面

浏览器窗口中的 Virtual Earth 功能是通过一个客户端 JavaScript 地图控件对象实现的。所以，要在您自己的网页中托管 Virtual Earth 地图，您只需要添加对地图控件的 JavaScript 源文件的引用，然后创建一个地图控件实例。

在 OnPageLoad 事件中，我们创建一个地图控件对象实例并将其插入到网页的 body 中。

var params = new Object(); 
params.latitude = startLat; 
params.longitude = startLon; 
params.zoomlevel = startZoom; 
params.mapstyle = Msn.VE.MapStyle.Hybrid; 
params.showScaleBar = true; 
params.showDashboard = false; 

map = new Msn.VE.MapControl(document.body, params); 
map.Init();

在处理 Media Center 遥控器按键的 OnRemoteEvent 事件处理程序中，我调用了以下地图控件方法：

• ContinuousPan - 当用户按下遥控器上的任意箭头键时使用的动画平移选项。
• ZoomIn, ZoomOut - 当用户按下遥控器上的频道 +/- 键时，地图会放大或缩小一个级别。
• SetMapStyle - 当用户按下遥控器上的 1、2 或 3 号键时，在航空影像、街道地图和混合模式之间切换地图样式。

有关使用 Virtual Earth 地图控件的更多详细信息，请参阅 Via Virtual Earth 网站。

用户还可以使用遥控器上的 7、8 和 9 号键来调整平移操作的大小。当您试图快速从地球的一侧导航到另一侧时，拥有较大的平移增量很有用，而当您放大到感兴趣的区域并想要进行精细的平移调整时，则需要较小的增量。

由于 Virtual Earth 是为普通显示器设计的，用户通常会离屏幕 2 英尺远，因此在 10 英尺远的电视上，文本通常难以阅读，尤其是使用隔行扫描闪烁的 CRT 电视时，所以我添加了一个本地缩放选项。用户可以使用遥控器上的 4、5 和 6 号键在 1、1.2 和 1.5 这三个本地缩放因子之间切换，这将放大网页，使文本更容易阅读。

现在，我们已经拥有了基本可在 Media Center 中使用的 Virtual Earth 体验，可以使用遥控器在 10 英尺远的电视前进行操作。最后要实现的部分是读取选定数码图像的纬度和经度的代码，然后将地图控件平移到照片拍摄的位置，并在地图上显示一个图钉。

function onRemoteEvent(keyChar)
{
    switch (keyChar)
    {
        case 38:    // Up button
            map.ContinuousPan(0, -panDelta, 20);
        break;
        case 40:    // Down button
            map.ContinuousPan(0, panDelta, 20);
        break;
        case 37:    // Left button
            map.ContinuousPan(-panDelta, 0, 20);
        break;
        case 39:    // Right button
            map.ContinuousPan(panDelta, 0, 20);
        break;
        case 33:    // Channel+
            map.ZoomIn();
        break;
        case 34:    // Channel-
            map.ZoomOut();
        break;
        case 49:    // 1 button
            map.SetMapStyle(Msn.VE.MapStyle.Aerial);
            window.external.MediaCenter.Dialog("Aerial", 
                                 "Map Style", 1, -1, false);
        break;
        case 50:    // 2 button
            map.SetMapStyle(Msn.VE.MapStyle.Road);
            window.external.MediaCenter.Dialog("Road", 
                                 "Map Style", 1, -1, false);
        break;
        case 51:    // 3 button
            map.SetMapStyle(Msn.VE.MapStyle.Hybrid);
            window.external.MediaCenter.Dialog("Hybrid", 
                                 "Map Style", 1, -1, false);
        break;
        case 52:    // 4 button
            document.body.style.zoom = 1.0;
            window.external.MediaCenter.Dialog("0%", 
                                 "Local Zoom", 1, -1, false);
        break;
        case 53:    // 5 button
            document.body.style.zoom = 1.2;
            window.external.MediaCenter.Dialog("20%", 
                                 "Local Zoom", 1, -1, false);
        break;
        case 54:    // 6 button
            document.body.style.zoom = 1.5;
            window.external.MediaCenter.Dialog("50%", 
                                 "Local Zoom", 1, -1, false);
        break;
        case 55:    // 7 button
            panDelta = 15;
            window.external.MediaCenter.Dialog("Large", 
                                 "Pan Amount", 1, -1, false);
        break;
        case 56:    // 8 button
            panDelta = 7;
            window.external.MediaCenter.Dialog("Medium", 
                                 "Pan Amount", 1, -1, false);
        break;
        case 57:    // 9 button
            panDelta = 3;
            window.external.MediaCenter.Dialog("Small", 
                                 "Pan Amount", 1, -1, false);
        break;
        case 166:    // Back button
            window.external.MediaCenter.CloseApplication();
        break;
    }

    return true;
}

EXIF GPS 组件

大多数人都熟悉数码相机作为 JPEG 图像一部分存储的快门速度、光圈、相机型号等 EXIF 数据。除了相机特定设置外，还有用于存储 GPS 数据的标准属性，如纬度、经度、海拔等。

目前市面上有少数相机带有内置 GPS 接收器，可以在拍照时存储 GPS 坐标。然而，也有一些软件程序允许您在拍照后添加 GPS 坐标并编辑任何 EXIF 数据。其中大多数允许您加载从单独的 GPS 接收器记录的 GPS 轨迹文件，并通过查看 EXIF 数据中的时间戳并根据轨迹点的时间戳查找最近的 GPS 轨迹点来估算照片的位置。

如果您没有关联的 GPS 轨迹文件，您总可以通过其他方式确定照片的纬度和经度，然后通过 EXIF 编辑器手动输入坐标。

请查看 World Wide Media Exchange 网站上的这个页面，该网站提供专门用于地理位置数据的 EXIF 编辑软件，并列出了许多提供类似功能的其他软件包。需要注意的一点是，EXIF 编辑程序在写入 EXIF 属性值时是否会重新压缩图像数据。如果这样做，并且您使用的是 JPEG 等有损图像文件格式，那么图像质量会受到一些损失。

为了读取 EXIF 的纬度和经度坐标，我使用了 GDI+ 中的 Image 类，该类具有读取和写入 EXIF 数据中存储的属性值的方法。我用 C++ 编写了一个简单的 COM 组件，通过 Image 类读取纬度和经度属性值。然后，ExifGPSExtractor 组件在网页上使用，并由 JavaScript 调用以检索位置数据，然后将地图平移并居中到该位置。地图上还会添加一个图钉，显示在照片的位置。

double CExifGPS::GetCoordinate(Image* image, int tag, int reftag)
{
    double coordinate = 0.0;

    unsigned int size = 0;
    PropertyItem* propertyItem = NULL;

    size = image->GetPropertyItemSize(tag);
    if(size > 0)
    {
        propertyItem = (PropertyItem*)malloc(size);
        image->GetPropertyItem(tag, size, propertyItem);

        long* pVals = (long*)(propertyItem->value);

        // Degrees
        coordinate = pVals[0];
        coordinate /= pVals[1];

        // Minutes, either mm/1 or mmmm/100 for decimal minutes
        double minutes = pVals[2];
        minutes /= pVals[3];

        // Seconds, either ss/1 or ssss/100 for decimal seconds
        double seconds = pVals[4];
        seconds /= pVals[5];

        coordinate += minutes / 60.0 + seconds / (60.0 * 60.0);

        free(propertyItem);
    }

    return coordinate * GetReferenceFactor(image, reftag);
}

if(window.external.MediaCenter.MediaContext != null)
{
    if(window.external.MediaCenter.MediaContext.ContextName == "Picture")
    {
        gps.Load(
          window.external.MediaCenter.MediaContext.GetProperty("Name"));
        startLat = gps.Latitude;
        startLon = gps.Longitude;        
        
        if(startLat != 0.0 || startLon != 0.0)
            startZoom = 10;
        else
            window.external.MediaCenter.Dialog("No GPS coordinates found", 
                                                   "No GPS", 1, -1, false);
    }
}

if(startLat != 0.0 || startLon != 0.0)
{
    map.AddPushpin(0, startLat, startLon, 40, 40, "pushpin", "");
}

使用 Virtual Earth Media Center 插件

下载程序包 zip 文件，并将其解压到您选择的位置，例如 c:\Program Files\VirtualEarth。然后运行 Register.cmd，它将注册 COM 组件并将 Virtual Earth HTML 插件注册到 Media Center。

要卸载，请确保已关闭 Media Center 中的 Virtual Earth，然后运行 Unregister.cmd 来注销 COM 组件和 Virtual Earth HTML 插件。然后删除文件。

要将 Virtual Earth 插件用作数字地图集，请转到“更多程序”主菜单选项，然后选择 Virtual Earth。

要将插件与地理编码的照片结合使用，请导航到“我的图片”主菜单，然后向下导航到您的图片文件夹。在查看文件夹中的缩略图时，您可以选择一张图片，然后按“i - 更多信息”遥控键。这将弹出一个上下文菜单，其中包含“更多…”菜单选项。

如果您已全屏打开一张图片进行查看，或者您正在观看幻灯片放映，并想获取当前图片的地点信息，请按“i - 更多信息”遥控键，然后从出现的上下文菜单中选择“图片详情”。图片详情页面显示后，再次按“i - 更多信息”遥控键，然后选择“更多…”菜单选项。

将显示一个已注册用于处理图片的可用插件列表的页面。从列表中选择“Virtual Earth”，然后将启动 Virtual Earth 网页，地图将居中在图片的位置，并且一个图钉显示了图片在地图上的位置。

待办事项

我还有几个额外的功能正在开发中。

• 显示您 Media Center 中所有照片图钉的选项，当您平移和缩放地图时，提供当前地图视图中所有照片的幻灯片放映选项。
• 在使用 Virtual Earth 作为数字地图集时进行地点名称搜索。
• 倾斜 - Virtual Earth 控件 2 版本引入的“鸟瞰视图”支持。

更新

• 更新了 HTML 文件，以引用和使用微软发布的新版本 2 Virtual Earth 控件。在引用新版 JavaScript 控件的 URL 以及控件初始化方式上进行了一些小的改动。