Skip to content

Unable to get basic timeline to work with unpkg libraries #281

Description

@chenc17

What you were expecting:
I tried to make a very simple timeline without a module bundler by following the instructions in the "Usage" section.

What happened instead:
I get the following console errors:

"ReferenceError: global is not defined
n              https://unpkg.com/event-drops:1
_initialize https://unpkg.com/event-drops:1
t               https://unpkg.com/event-drops:1
call           https://unpkg.com/d3:2"
"Source map error: Error: request failed with status 404
Resource URL: https://unpkg.com/event-drops
Source Map URL: index.js.map"

Steps to reproduce:

Put the code in the "Related code" section below in a file called "index.html" and open it in a Firefox or Chrome browser.

Related code:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Event Drops Demo</title>
        <link href="https://fonts.googleapis.com/css?family=Josefin+Sans:300" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css?family=Muli" rel="stylesheet">
        <link href="https://unpkg.com/event-drops/dist/style.css" rel="stylesheet" />
    </head>

    <body>
        <h1>Event Drops Demo</h1>
        <div id="eventdrops-demo" style="width: 90%;"></div>
        <footer>
            <p>
                Released under MIT license, courtesy of <a href="http://marmelab.com/">marmelab</a>
                and <a href="https://github.com/canalplus">Canal Plus</a>. More details on our
                <a href="https://github.com/marmelab/EventDrops">GitHub repository</a>.
            </p>
        </footer>

        <script src="https://unpkg.com/d3"></script>
        <script src="https://unpkg.com/event-drops"></script>
        <script id='code'>

            const chart = eventDrops({});

            const repositoriesData = [
            {
                name: 'admin-on-rest',
                data: [{ date: new Date('2014/09/15 14:21:31') } /* ... */],
            },
            {
                name: 'event-drops',
                data: [{ date: new Date('2014/09/15 13:24:57') } /* ... */],
            },
            {
                name: 'sedy',
                data: [{ date: new Date('2014/09/15 13:25:12') } /* ... */],
            },
            ];

            d3
            .select('#eventdrops-demo')
            .data([repositoriesData])
            .call(chart);
        </script>
    </body>
</html>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions