Javascript JVector交互式地图未在Rails 3中渲染_Javascript_Jquery_Ruby On Rails_Jvectormap

Javascript JVector交互式地图未在Rails 3中渲染

javascript jquery ruby-on-rails

Javascript JVector交互式地图未在Rails 3中渲染,javascript,jquery,ruby-on-rails,jvectormap,Javascript,Jquery,Ruby On Rails,Jvectormap,我一直试图在Rails 3应用程序中使用这个非常酷的JVector交互式地图插件，但我一定是做错了什么，因为地图没有渲染。我没有在Rails中使用太多JQuery，所以我在这方面有点新手。我创建了一个名为Maps的控制器和一个名为Intro.html.erb的视图，其中包括本教程中的html：我还通过将.js函数放在application.js中来拆分它们。由于这不起作用，我找到了一些其他代码，我试图将它们放入Intro.html.erb文件中： <!DOCTYPE html>

我一直试图在Rails 3应用程序中使用这个非常酷的JVector交互式地图插件，但我一定是做错了什么，因为地图没有渲染。我没有在Rails中使用太多JQuery，所以我在这方面有点新手。我创建了一个名为Maps的控制器和一个名为Intro.html.erb的视图，其中包括本教程中的html：

我还通过将.js函数放在application.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>


试验
$（函数（）{
$（'#map'）.vectorMap（）；
});

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

非常感谢您的帮助。

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

<!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>


jVectorMap演示
$（函数（）{
$（“#世界地图”）.vectorMap（）；
});

这是您需要的文档所在的文件夹。在本地主机上下载并解压以下htdocs，通过在js初始化中指定导入的映射修复了相同的问题

  $('#world-map').vectorMap(
  {
    map: 'world-en',
  }

控制台中有错误消息吗？所有的JS文件都被加载了吗？没有，没有错误。我甚至尝试了一个使用javascript警报弹出对话框的小测试，它成功了。但是我如何确定是否加载了JVector.JS文件呢？请检入浏览器的Firebug/console/etc，并确保它列在脚本集合中。它们可以去任何可以公开访问的地方。通常，您会使用javascript_标记来加载它们；它会为您构建URL。如果您厌倦了键入，您还可以在config/application.rb中定义默认情况下要加载的javascript文件；）很高兴您已经解决了。