2

我一直在尝试将这个非常酷的 JVector Interactive 地图插件与我的 Rails 3 应用程序一起使用，但我一定做错了，因为地图没有呈现。我在 Rails 中使用的 JQuery 不多，所以在这方面有点新意。我创建了一个名为 Maps 的控制器和一个名为 Intro.html.erb 的视图，其中包括本教程中的 html：http: //developer.practicalecommerce.com/articles/2988-Create-an-Interactive-Map-with-jVectorMap

我还通过将它们放在 application.js 中来拆分我的 .js 函数。由于这不起作用，我发现了一些我试图放入 Intro.html.erb 文件的其他代码：

<!DOCTYPE html>
  <html>
  <head>
  <title>Test</title>
    <link rel="stylesheet" href="public/javascripts/jquery.vector-map.css"     type="text/css" media="screen" />   
    <script src="public/javascripts/jquery.min.js"></script>
    <script src="public/javascripts/jquery.vector-map.js"></script>
    <script src="public/javascripts/world-en.js"></script>
    <script>
      $(function(){
       $('#map').vectorMap();
    });
   </script>
 </head>
  <body>
    <div id="map" style="width: 600px; height: 400px;"></div>
  </body>
</html>

它仍然没有渲染。我正在尝试在我的开发环境中运行它并在本地指向文件。例如：public/javascripts/world-en.js"

任何帮助将不胜感激。

4

2 回答 2

1

您想使用“世界地图”，但在您的定义中您正在定义“#map”。这是您可以尝试的正确代码：

<!DOCTYPE html>
<html>
<head>
  <title>jVectorMap demo</title>
  <link rel="stylesheet" href="scripts/jquery-jvectormap-1.2.2.css" type="text/css" media="screen"/>
  <script src="scripts/jquery-1.8.2.js"></script>
  <script src="scripts/jquery-jvectormap-1.2.2.min.js"></script>
  <script src="scripts/jquery-jvectormap-world-mill-en.js"></script>
</head>
<body>
  <div id="world-map" style="width: 600px; height: 400px"></div>
  <script>
    $(function(){
      $('#world-map').vectorMap();
    });

  </script>
</body>
</html>

这是包含您需要的文档的文件夹。下载并解压以下文件夹到您本地主机上的 htdocs

于 2013-04-25T03:54:09.257 回答
0

同样的问题，通过在js初始化中指定导入的地图来解决

  $('#world-map').vectorMap(
  {
    map: 'world-en',
  }
于 2016-01-31T15:15:50.743 回答