在Ruby on Rails中包含Trianglify

I am trying to make a background using trianglify. To do this I must include it in my project and use it properly. The thing I am trying to achieve is making a background like trianglify is supposed to.

我正在尝试使用trianglify制作背景。要做到这一点,我必须将它包含在我的项目中并正确使用它。我想要实现的目标是制作像trianglify这样的背景。

here is my application.html.erb

这是我的application.html.erb

 <!DOCTYPE html>
<html>
  <head>
    <title><%= full_title(yield(:title)) %></title>
    <%= stylesheet_link_tag "application", media: "all",
                                           "data-turbolinks-track" => true %>
    <%= javascript_include_tag "application", "data-turbolinks-track" => true %>
    <%= csrf_meta_tags %>



  </head>
  <body>

    <%= render 'layouts/header' %>
    <div class="container">
     <div class="row">
      <% flash.each do |message_type, message| %>
        <div class="alert alert-<%= message_type %>"><%= message %></div>
      <% end %>
      <%= yield %>
     </div>
      <%= render 'layouts/footer' %>
      <%= debug(params) if Rails.env.development? %>
    </div>

  </body>



</html>


<script>
    var Trianglify = require([]);
    var pattern = Trianglify({
        width: window.innerWidth, 
        height: window.innerHeight
    });
    document.body.appendChild(pattern.canvas())
</script>

Obviously it didn't put a background image . I checked with inspector and I get

显然它没有放置背景图像。我和督察检查了一下

    ReferenceError: require is not defined trianglify.js:8:4
ReferenceError: require is not defined localhost:3000:32:8

I guess it doesn't import something or I did something wrong?

我想它不会导入某些东西或者我做错了什么?

To solve this error I downloaded http://requirejs.org/docs/release/2.1.17/comments/require.js and now i get another error namely:

为了解决这个错误,我下载了http://requirejs.org/docs/release/2.1.17/comments/require.js,现在又收到了另一个错误:

Error: Module name "delaunay-fast" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded require.js:167:16
Error: Module name "trianglify" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded

1 个解决方案

#1

ahhh, I got your code resulting perfect outcome by putting that js in app/assets/javascripts/ directory and, putting that script which calls Trianglify below end of the body tag, because at the time when document.body.appendChild(pattern.canvas()) was trying to append child there was no existing body. Hope it helps.

啊,我把你的代码放到了app / assets / javascripts /目录中,然后把那个调用Trianglify的脚本放在body标签的末尾,因为当时是document.body.appendChild(pattern.canvas) ())试图追加孩子没有现存的身体。希望能帮助到你。

秒客网

在Ruby on Rails中包含Trianglify

1 个解决方案

#1

#1

相关文章