npm's personal messenger
Have opinions about JavaScript? We want to hear them. Take the 2018 JavaScript Ecosystem Survey »

basicprimitives

5.1.0 • Public • Published

Basic Primitives

JavaScript Diagrams Library - implements organizational and multi-parent diagrams. Archive contains implementations of JavaScript Controls and PDFkit plugins. PDFkit is NodeJS and in browser PDF rendering library. Diagrams visualize nodes using HTML templates combined with HTML5 Canvas and SVG graphics elements. Diagrams work in all major modern browsers Internet Explorer, Chrome, Firefox, Safari including mobile browsers.

Supported Diagrams

  • Hierarchy Visualization
  • Organizational Chart
  • Multi-parent hierarchical chart
  • Family Tree
  • Dependencies Diagram
  • PERT chart
  • Financial Ownership Diagram

Getting Started

Go to http://www.basicprimitives.com to see on-line examples and samples.

First Organizational Diagram Sample

<!DOCTYPE html> 
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>First organization diagram</title>

    <!-- # include file="../../src.primitives/src.primitives.html"-->
    <script type="text/javascript" src="../../min/primitives.min.js?5000"></script>
    <link href="../../min/primitives.latest.css?5000" media="screen" rel="stylesheet" type="text/css" />

    <script type='text/javascript'>
        var control;
        var timer = null;

        document.addEventListener('DOMContentLoaded', function () {
            var options = new primitives.orgdiagram.Config();

            var items = [
                new primitives.orgdiagram.ItemConfig({
                    id: 0,
                    parent: null,
                    title: "Scott Aasrud",
                    description: "VP, Public Sector",
                    image: "../images/photos/a.png"
                }),
                new primitives.orgdiagram.ItemConfig({
                    id: 1,
                    parent: 0,
                    title: "Ted Lucas",
                    description: "VP, Human Resources",
                    image: "../images/photos/b.png"
                }),
                new primitives.orgdiagram.ItemConfig({
                    id: 2,
                    parent: 0,
                    title: "Fritz Stuger",
                    description: "Business Solutions, US",
                    image: "../images/photos/c.png"
                })
            ];

            options.items = items;
            options.cursorItem = 0;
            options.hasSelectorCheckbox = primitives.common.Enabled.True;

            control = primitives.orgdiagram.Control(document.getElementById("basicdiagram"), options);
        });

    </script>
</head>
<body>
    <div id="basicdiagram" style="width: 640px; height: 480px; border-style: dotted; border-width: 1px;"></div>
</body>
</html>

License

Copyright (c) 2013 - 2018 Basic Primitives Inc Non-commercial - Free http://creativecommons.org/licenses/by-nc/3.0/

Commercial and government licenses: http://www.basicprimitives.com/pdf/license.pdf

Keywords

none

install

npm i basicprimitives

Downloadsweekly downloads

10

version

5.1.0

license

http://www.basicprimitives.com/pdf/license.pdf

last publish

collaborators

  • avatar
Report a vulnerability