【问题标题】:Literally Canvas - I can not find any tools on my page?Literally Canvas - 我在我的页面上找不到任何工具?
【发布时间】:2016-04-05 22:10:35
【问题描述】:

我的代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Literally Canvas</title>
    <link href="css/literallycanvas.css" rel="stylesheet">
    <script src="jquery-2.1.4.min.js"></script>
    <script src="react-with-addons.min.js"></script>
    <script src="underscore-min.js"></script>
    <script src="js/literallycanvas-core.min.js"></script>
    <script src="js/literallycanvas.js"></script>

</head>
<body>
    <div class="literally"></div>
    <form class="controls export">
        <input type="submit" data-action="export-as-png" value="Export as PNG">
    </form>
    <script>
        $(document).ready(function(){  
              //initial without jQuery
              var lc = LC.init(
                      document.getElementsByClassName('literally')[0],{
                          imageURLPrefix:'img',
                          primaryColor:'#fff',
                          backgroundColor:'#ddd',
                          toolbarPosition:'top',
                          tools:
                                  [
                                      LC.tools.Pencil,
                                      LC.tools.Eraser,
                                      LC.tools.Line,
                                      LC.tools.Rectangle,
                                      LC.tools.Text,
                                      LC.tools.Polygon
                                  ]
                      });
            //export as png
              $('.controls.export [data-action=export-as-png]').click(function(e) {
                  e.preventDefault();
                  window.open(lc.getImage().toDataURL());
              });             
          });
    </script>
</body>
</html>

我已经下载了 literallycanvas-0.4.11 并将css/img/ 下的文件添加到我的项目中,以及来自js/ 的相应文件。 我可以看到最初的工作,因为我可以看到 primaryColor 已更改,但我找不到我的工具。 我关注了literally canvas,但它仍然有问题。 有人可以帮帮我吗??

【问题讨论】:

  • 嗨,这里是 Literally Canvas 维护者。您应该包含literallycanvas.js literalcanvas-core.js,而不是同时包含两者。尝试删除“核心”版本,然后重试。
  • 如果只包含字面意义上的canvas-core.js,则工具栏不可用。

标签: html canvas drag-and-drop drawing


【解决方案1】:

我更改了imageURLPrefix 选项,它对我有用。只需将路径写入您的img 文件夹即可。

var lc = LC.init(
    document.getElementsByClassName('my-drawing')[0],
    {
       imageURLPrefix: 'path/to/your/img',
       .....     
       ..... 
    });

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2012-07-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-08-18
    • 2018-09-05
    • 1970-01-01
    相关资源
    最近更新 更多