Nocturnal Practitioners of Magic

    @cerner/carbon-graphs

    2.21.0 • Public • Published

    Carbon Graphs

    Build Status npm

    A vanilla JavaScript graphing library built using d3 based on Cerner design standards.


    Installing Carbon

    • Install from npmjs using the command below:
    npm i @cerner/carbon-graphs --save-dev

    Getting Started

    To create a graph with carbon, first let's create a graph configuration object and use it to initialize that canvas:

    const GRAPH_DATA = {
      bindTo: "#root",
      axis: {
        x: {
          show: true,
          label: "x-axis label",
          lowerLimit: 0,
          upperLimit: 100
        },
        y: {
          show: true,
          label: "y-axis label",
          lowerLimit: 0,
          upperLimit: 10,
        },
      }
    };
    
    var canvas = Carbon.api.graph(GRAPH_DATA);

    Let's create a sample dataset to plot:

    const CONTENT_DATA1 = {
      key: "uid_1",
      label: {
        display: "Dataset A"
      },
      values: [
        {
          x: 10,
          y: 9
        },
        {
          x: 45,
          y: 3
        },
        {
          x: 60,
          y: 7
        },
        {
          x: 77,
          y: 8
        },
        {
          x: 94,
          y: 2
        }
      ]
    };

    The data can now by plotted by as a line graph by using the following:

        canvas.loadContent(Carbon.api.line(CONTENT_DATA1));

    This results in the following graph:

    Alt

    Graph types

    The following graph types can be plotted using Carbon:

    LICENSE

    Copyright 2017 - present Cerner Innovation, Inc.

    Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

        http://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

    Install

    npm i @cerner/carbon-graphs

    DownloadsWeekly Downloads

    248

    Version

    2.21.0

    License

    Apache-2.0

    Unpacked Size

    1.51 MB

    Total Files

    124

    Last publish

    Collaborators

    • benbcai
    • ryanthemanuel
    • mraplumb