SVG. JS не отображается предварительный просмотр чертежа? - PullRequest
Новая
       49

SVG. JS не отображается предварительный просмотр чертежа?

0 голосов
/ 16 июня 2020

Я хочу нарисовать пути svg (многоугольник) на своем веб-сайте, но не могу заставить плагины svg. js и svg.draw. js работать правильно.

Как вы можете видеть на этом демонстрационная страница https://svgjs.com/svg.draw.js/demo/index.html (третья демонстрация с заголовком «Многоугольник, нажмите Enter, чтобы завершить sh фигуру»)

Когда вы начинаете щелкать, появляется строка предварительного просмотра, но когда я копирую точную демонстрацию, но использую вместо этого веб-пакет, он не работает.

Я использую:

svg. js 2.7.1 и svg.draw. js 2.0.4

Импорт в js: 

import 'svg.js';
import 'svg.draw.js';

Javascript: 

let svg_canvas = SVG('draw-poly').size('100%', '100%');
    let shape = svg_canvas.polygon().draw();

    svg_canvas.on('drawstart', function(e){
        document.addEventListener('keydown', function(e){
            if(e.keyCode == 13){
                shape.draw('done');
                svg_canvas.off('drawstart');
            }
        });
    });

HTML: 

<style>
    #draw-poly{
        width:700px;
        height:300px;
        margin:20px 0 0;
        border:1px solid black;
    }
</style>
<div class="container">
    <h1>hallo</h1>

    <div id="draw-poly"></div>
</div>
...