Question

我是ASP.NET和MVC的菜鸟，请耐心等待，并提前感谢您的帮助！ -

我正在尝试链接到存储在应用程序根目录中的KML文件，但我无法使其工作，请参阅下文：

function initCB(instance) {
            ge = instance;
            ge.getWindow().setVisibility(true);

            var href = 'http://code.google.com/apis/earth/documentation/samples/kml_example2.kml';
            var href2 = '~/cngKml.kml'
            google.earth.fetchKml(ge, href2, kmlFinishedLoading);

        }

当我将它指向'href'变量时它起作用，但当我将它指向'href2'变量时，它不会加载任何东西。

完整的index.cshtml如下：

@{
    ViewBag.Title = "STI";
    string path = HttpUtility.JavaScriptStringEncode(HttpContext.Current.Server.MapPath("~/kml_example2.kml"));
}
<head>
    <title>CNG</title>
    <script type="text/javascript" src="https://www.google.com/jsapi"> </script>
    <script type="text/javascript">

        var ge;
        var placemark;
        var kmlObject;

        google.load("earth", "1", { "other_params": "sensor=false" });

        function init() {
            google.earth.createInstance('map3d', initCB, failureCB);
        }

        function initCB(instance) {
            ge = instance;
            ge.getWindow().setVisibility(true);

            var href = 'http://code.google.com/apis/earth/documentation/samples/kml_example2.kml';
            var href2 = '@path';
            google.earth.fetchKml(ge, href2, kmlFinishedLoading);
        }

        function kmlFinishedLoading(obj) {
            kmlObject = obj;
            if (kmlObject) {
                if ('getFeatures' in kmlObject) {
                    kmlObject.getFeatures().appendChild(placemark);
                }
                ge.getFeatures().appendChild(kmlObject);
                if (kmlObject.getAbstractView())
                    ge.getView().setAbstractView(kmlObject.getAbstractView());
            }
        }

        function failureCB(errorCode) {
        }

        google.setOnLoadCallback(init);

    </script>
</head>

@section featured {
    <section class="featured">
        <div class="content-wrapper">
            <hgroup class="title">
                <h1>@ViewBag.Title.</h1>
                <h2>@ViewBag.Message</h2>
            </hgroup>
        </div>
    </section>
}

<div id="gearth">
    <div id="map3d" style="width:960px; height:640px; align-self:center;"></div>
</div>

结果HTML：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>STI</title>
        <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        <meta name="viewport" content="width=device-width" />
        <link href="/Content/site.css" rel="stylesheet"/>

        <script src="/Scripts/modernizr-2.6.2.js"></script>

    </head>
    <body>
        <header>
            <div class="content-wrapper">
                <div class="float-left">
                    <p class="site-title"><a href="/">sti</a></p>
                </div>
                <div class="float-right">
                    <section id="login">

        Hello, <a class="username" href="/Account/Manage" title="Manage">reecea</a>!
<form action="/Account/LogOff" id="logoutForm" method="post"><input name="__RequestVerificationToken" type="hidden" value="J0EkwX2027gRZ-gDCvH1WMHGpGUnW-Sl2m3jEOpKw2684DUjjywYCFBQ9pPNfJ93pyJIZ9XH9HLMYdFNiVcHohtNsvKA1sIiKf3tL3EekGI1" />            <a href="javascript:document.getElementById('logoutForm').submit()">Log off</a>
</form>    

                    </section>
                    <nav>
                        <ul id="menu">
                            <li><a href="/">Home</a></li>
                                <li><a href="/Admin">Admin</a></li>
                                <li><a href="/Account/Manage">My Account</a></li>
                        </ul>
                    </nav>
                </div>
            </div>
        </header>
        <div id="body">

    <section class="featured">
        <div class="content-wrapper">
            <hgroup class="title">
                <h1>STI.</h1>
                <h2>CNG Stations Map</h2>
            </hgroup>
        </div>
    </section>

            <section class="content-wrapper main-content clear-fix">

<head>
    <title>CNG</title>
    <script type="text/javascript" src="https://www.google.com/jsapi"> </script>
    <script type="text/javascript">

        var ge;
        var placemark;
        var kmlObject;

        google.load("earth", "1", { "other_params": "sensor=false" });

        function init() {
            google.earth.createInstance('map3d', initCB, failureCB);
        }

        function initCB(instance) {
            ge = instance;
            ge.getWindow().setVisibility(true);

            var href = 'http://code.google.com/apis/earth/documentation/samples/kml_example2.kml';
            var href2 = 'c:\\users\\reecea\\documents\\visual studio 2013\\Projects\\CngStationMap\\CngStationMap\\kml_example2.kml';
            google.earth.fetchKml(ge, href2, kmlFinishedLoading);
        }

        function kmlFinishedLoading(obj) {
            kmlObject = obj;
            if (kmlObject) {
                if ('getFeatures' in kmlObject) {
                    kmlObject.getFeatures().appendChild(placemark);
                }
                ge.getFeatures().appendChild(kmlObject);
                if (kmlObject.getAbstractView())
                    ge.getView().setAbstractView(kmlObject.getAbstractView());
            }
        }

        function failureCB(errorCode) {
        }

        google.setOnLoadCallback(init);

    </script>
</head>


<div id="gearth">
    <div id="map3d" style="width:960px; height:640px; align-self:center;"></div>
</div>


            </section>
        </div>
        <footer>
            <div class="content-wrapper">
                <div class="float-left">
                    <p>&copy; 2014 - STI</p>
                </div>
            </div>
        </footer>

        <script src="/Scripts/jquery-1.8.2.js"></script>



<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
    {"appName":"Chrome","requestId":"9f6ba0e6c2d041d29dcc37b58bbb4ef4"}
</script>
<script type="text/javascript" src="http://localhost:54165/39bfdebe74ed45968bc576a815347820/browserLink" async="async"></script>
<!-- End Browser Link -->

</body>
</html>

Web.Config文件：

  <system.webServer>
    <staticContent>
      <remove fileExtension=".kml"/>
      <mimeMap fileExtension=".kml" mimeType="application/vnd.google-earth.kml+xml"/>
    </staticContent>

Answer 1

只需尝试var href2 = '/cngKml.kml'

您不能将物理文件路径用于链接（即Server.MapPath("~/cngKml.kml")）。

您不能在服务器需要解析的客户端代码中使用路径（即"~/anything"）。

您无法在C#中声明变量，然后像您尝试的那样在JavaScript中使用它。在上面的例子中，您至少需要使用'@path'（尽管它仍然不起作用）。

另外，请确认导航到Web服务器上的kml文件甚至可以正常工作，因为IIS通常不会提供未知文件类型。如果这是一个问题，您可以使用类似于this SO post，more ref的web.config条目进行修复。

Answer 2

尝试更改：

var href2 = path;

到那个：

var href2 = @path;

如果没有@ char，它将被视为简单的JS变量

顺便说一句，如果您在C＃中定义变量然后在JavaScript中使用它，请不要忘记使用HttpUtility.JavaScriptStringEncode：

string path = HttpUtility.JavaScriptStringEncode(HttpContext.Current.Server.MapPath("~/cngKml.km"));

链接问题与MVC

2 个答案: