Compose complex, data-driven visualizations from reusable charts and components with d3

Overview

d3.compose

Compose rich, data-bound charts from charts (like Lines and Bars) and components (like Axis, Title, and Legend) with d3 and d3.chart.

  • Advanced layout engine automatically positions and sizes charts and components, layers by z-index, and is responsive by default with automatic scaling
  • Standard library of charts and components for quickly creating beautiful charts
  • Chart and Component bases for creating composable and reusable charts and components
  • Includes helpers and mixins that cover a range of standard functionality
  • CSS class-based styling is extensible and easy to customize to match your site

npm version

Getting Started

  1. Download the latest release

  2. Download the dependencies:

  3. Add d3.compose and dependencies to your html:

    <!doctype html>
    <html>
      <head>
        <!-- ... -->
    
        <link rel="stylesheet" type="text/css" href="d3.compose.css">
      </head>
      <body>
        <!-- ... -->
    
        <script src="d3.js"></script>
        <script src="d3.chart.js"></script>
    
        <script src="d3.compose.js"></script>
    
        <!-- Your code -->
      </body>
    </html>
  4. Create your first chart

    var chart = d3.select('#chart')
      .chart('Compose', function(data) {
        var scales = {
          x: {type: 'ordinal', data: data, key: 'x'},
          y: {data: data, key: 'y'}
        };
    
        var charts = [
          d3c.lines({
            data: data,
            xScale: scales.x,
            yScale: scales.y
          })
        ];
    
        var yAxis = d3c.axis({scale: scales.y});
    
        return [
          [yAxis, d3c.layered(charts)]
        ];
      })
      .width(600)
      .height(400);
    
    chart.draw([{x: 0, y: 10}, {x: 10, y: 50}, {x: 20, y: 30}]);

Examples and Docs

See http://CSNW.github.io/d3.compose/ for live examples and docs.

Development

  1. Install modules npm install
  2. Test with npm test or npm run test:watch
  3. Build with npm run build

Note on testing: Requires Node 4+ (for latest jsdom) and d3.chart doesn't currently support running from within node and requires the following line be added inside the IIFE in node_modules/d3.chart.js: window = this; (before use strict). This will be resolved by a pending PR to fix this issue with d3.chart (also, the dependency on d3.chart is likely to be removed in a later version of d3.compose).

Release

(With all changes merged to master and on master branch)

  1. npm version {patch|minor|major|version}
  2. npm publish

Docs

  1. On master, run npm run docs
  2. Switch to gh-pages branch
  3. Navigate to _tasks directory (cd _tasks)
  4. (npm install _tasks, if necessary)
  5. Run docs task npm run docs
  6. Navigate back to root
  7. View site with bundle exec jekyll serve

Note: For faster iteration, create a separate clone, switch to gh-pages branch, set docs_path environment variable to original clone (e.g. Windows: SET docs_path=C:\...\d3.compose\_docs\), and then run steps 3-6.

Comments
  • Time scales do not have width or rangeBand

    Time scales do not have width or rangeBand

    The itemWidth function returns either a scale's width or uses the rangeBand to calculate one. It appears that d3.scale.time has neither function.

    I've not come up with a workaround for this, as most suggestions are to simply calculate width/data.length which seems unlikely to be what's intended.

    Open to suggestions!

    opened by tpitale 12
  • Data layer spike

    Data layer spike

    Add Store, Subset, and Series

    • Store contains all data and will include load and other methods for loading data from csv/json
    • Subset allows for processing store without changes affecting store
    • Series contains helpers for converting raw data to series representation

    Goal usage:

    store = new data.Store();
    store.load('data.csv')
      .normalize(function(row) {
        // Normalize data as it comes in into expected format
        row.date = new Date(row.date);
    
        return row;
      })
      .filter(function(row) {
        // Apply global filter to data
        return !row.isEstimate;
      })
      .values(function(values) {
        console.log('all values (loaded async)');
      });
    
    // Create subset for processing into chart data
    var chartData = store.subset()
      .transform(function(row) {
        // Add helper column just for chart
        row.avg = (row.a + row.b) / 2;
        return row;
      })
      .filter(function(row) {
        // Filter rows for chart
        return row.year >= 2000;
      })
      .process(function(rows) {
        // Process all rows into series form
        return {
          simple: data.Series(rows)
            .x('year')
            .y({yValue: 'avg', series: {name: 'Avg'}})
            .value(),
          complex: data.Series(rows)
            .x('year')
            .y([
              {yValue: 'a', series: {name: 'A'}},
              {yValue: 'b', series: {name: 'B'}}
            ])
            .value()
        };
      });
    
    // Load values and draw chart
    chartData.values(function(values) {
      // Processed data (loaded async)
      chart.draw(values);
    });
    
    opened by timhall 11
  • Axis refactor

    Axis refactor

    New axis implementation that passes scales from the axis to the charts that are using that axis.

    • x and y scales created by default and apply to all data / charts by default. If x2 or y2 scales are created, the given dataKey property is used to filter the data/charts for the other axes so that scales are set for the correct data and passed to the correct charts
    • New resolveChart helper for identifying charts using properties
    • Simplified configuration due to the scales being set on axes only, simpler type requirements for resolving charts, and intelligent axes defaults
    // Before
    config: {
      charts: [
        {
          type: 'Bars',
          dataKey: 'results',
          yScale: {domain: [0, 20000]}
        },
        {
          type: 'LineValues'
          dataKey: 'input',
          yScale: {domain: [0, 70]}
        }
      ],
      axes: [
        {
          type: 'AxisValues',
          dataKey: 'results',
          axisPosition: 'bottom'
        },
        {
          type: 'AxisValues',
          dataKey: 'results',
          axisPosition: 'left'
          yScale: {domain: [0, 20000]}
        },
        {
          type: 'AxisValues',
          dataKey: 'input',
          axisPosition: 'right',
          yScale: {domain: [0, 70]}
        }
      ] 
    }
    
    // After
    config = {
      type: 'Values'
      charts: [
        {
          type: 'Bars',
          dataKey: 'results',
        },
        {
          type: 'Line'
          dataKey: 'input',
        }
      ],
      axes: {
        // x created using defaults and used by all dataKeys/charts
        // y is used by all dataKeys/charts except dataKey:'input' (y2)
        y: {scale: {domain: [0, 20000]}},
        y2: {dataKey: 'input', scale: {domain: [0, 70]}}
      }  
    }
    

    @john-clarke Ready for review and merge

    PT: https://www.pivotaltracker.com/story/show/68384898

    opened by timhall 3
  • Add Testing

    Add Testing

    • Add grunt task for running jasmine specs (jasmine selected for what seems like better browser support since this is client-side library)
    • Add specs for helpers and extensions (more to come over time)
    • Update helpers and extensions
    • Store generated spec runner at specs/index.html

    @laurenclarke This is just the starting point for adding testing of the actual d3 output. Ready to review and merge

    opened by timhall 3
  • Example causes typeError

    Example causes typeError

    Probably missing something simple but.

    test.html

        <html>
          <head>
            <script type="text/javascript"
                    src="/vast/libs/d3.js"></script>
            <script type="text/javascript"
                    src="/vast/libs/d3.chart.js"></script>
            <script type="text/javascript"
                    src="/vast/libs/d3.compose-all.js"></script>
            <link   type="text/css"
                   href="/vast/css/d3.compose.css"
                    rel="stylesheet"
                   >
           <script>
            var data = [
                {x: 1, y: 100,},
                {x: 2, y: 200,},
                {x: 3, y: 150,}
            ];
    
            var chart = d3.select('#chart').chart('Compose', function(data){
                var charts = [
                    d3c.lines('results', {data: data})
                ];
                return [
                    d3c.layered(charts)
                ];
            });
            chart.draw(data);
        </script>
      </head>
      <body>
        <h1>Competed Count</h1>
        <div id="chart"></div>
      </body>
    </html>
    

    Generates the following Error: Uncaught TypeError: Cannot read property 'tagName' of nullBase.extend.initialize @ d3.compose-all.js:2106Base @ d3.compose-all.js:1151Child @ d3.compose-all.js:1303d3.selection.chart @ d3.chart.js:721(anonymous function) @ vizstats.html:20

    d3.js 3.5.5 d3.chart 0.2.1 everything else pulled from links on your website.

    Thanks.

    opened by toddbruner 2
  • Hover labels

    Hover labels

    Initial hover labels implementation

    TODO:

    • [x] Refactor into standalone component/chart
    • [ ] Add support for tolerance so that only "nearby" points are shown
    • [x] Make HoverLabels extend Labels
    • [x] Use alignment option
    • [x] Make Labels extendable (for use in EndLabels)

    To view: grunt debug then localhost:4001/debug.html

    opened by timhall 2
  • Titles

    Titles

    • Add chart and axis titles
    • Component layout: Pre-draw components to get accurate dimensions, layout with stacking on each side, and then draw all charts/components (look at stacking of axis and axis title for this in effect)

    Example:

    var config = {
      // ...
      // Chart title (with defaults top and no rotation)
      title: 'Chart Title' // Defaults to top with no rotation
      title: {position: 'left', title: 'Chart Title'} // Defaults to rotated -90 degrees
      title: {position: 'left', rotation: 0, title: 'Chart Title'}
    
      axes: {
        x: {title: 'X Axis Title'}, // Defaults to placement on axis side and rotation as-needed
        y: {title: {rotation: 0, title: 'Y Axis Title (without rotation)'}},
        secondaryY: {title: {position: 'top', title: 'Secondary Y (at top for some reason)'}}
      }
    }
    
    opened by timhall 2
  • Initial work on extensible line-bar chart

    Initial work on extensible line-bar chart

    Key points:

    • Container is used to place charts (with chartBase) so that individual charts don't have to worry about padding/margins and can instead be full-width and full-height and placed by Container
    • Container stores raw data and handles redraws when any dimensions change
    • Shared data manipulation and scaling is handled in XYBase and CenteredValueBase so that each chart gets a common data format and scales. Additionally, this data is first transformed in the Container so that a common transformation can be applied.
    • property helper is used to define chainable getters/setters for charts
    • dimensions helper is used to robustly determine width and height of given chart

    Hierarchy:

    Base (width, height, data)
    |_ Container (rawData, chartBase, bounds)
       |_ LineBarChart (includes BarChart and CenteredLineChartWithLabels)
    |_ XYBase (x, y, scales)
       |_ ValueBase (updates x, y for values)
          |_ CenteredValueBase (itemWidth, itemPadding)
             |_ BarChart
             |_ CenteredLineChart
             |_ CenteredDataLabelsChart
             |_ CenteredLineChartWithLabels (includes CenteredLineChart and CenteredDataLabelsChart)
    
    opened by timhall 2
  • Bump tar from 4.4.13 to 4.4.15

    Bump tar from 4.4.13 to 4.4.15

    Bumps tar from 4.4.13 to 4.4.15.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • Bump lodash from 4.17.15 to 4.17.19

    Bump lodash from 4.17.15 to 4.17.19

    Bumps lodash from 4.17.15 to 4.17.19.

    Release notes

    Sourced from lodash's releases.

    4.17.16

    Commits
    Maintainer changes

    This version was pushed to npm by mathias, a new releaser for lodash since your current version.


    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • Bump tough-cookie from 2.3.2 to 2.3.4

    Bump tough-cookie from 2.3.2 to 2.3.4

    Bumps tough-cookie from 2.3.2 to 2.3.4.

    Commits
    • e4dfb0a 2.3.4
    • 7d66ffd Update public suffix list
    • 7564c06 Merge pull request #100 from salesforce/no-re-parser
    • 751da6d Document removal of 256 space limit
    • 8452ccd Convert date-time parser from regexp, expand tests
    • 8614dbf More String#repeat polyfill
    • 2a4775c Avoid unbounded Regexp parts in date parsing
    • c9bd79d Parse cookie-pair part without regexp
    • 12d4266 2.3.3
    • 98e0916 Merge pull request #97 from salesforce/spaces-ReDoS
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot ignore this [patch|minor|major] version will close this PR and stop Dependabot creating any more for this minor/major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • Bump express from 4.17.1 to 4.18.2

    Bump express from 4.17.1 to 4.18.2

    Bumps express from 4.17.1 to 4.18.2.

    Release notes

    Sourced from express's releases.

    4.18.2

    4.18.1

    • Fix hanging on large stack of sync routes

    4.18.0

    ... (truncated)

    Changelog

    Sourced from express's changelog.

    4.18.2 / 2022-10-08

    4.18.1 / 2022-04-29

    • Fix hanging on large stack of sync routes

    4.18.0 / 2022-04-25

    ... (truncated)

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump decode-uri-component from 0.2.0 to 0.2.2

    Bump decode-uri-component from 0.2.0 to 0.2.2

    Bumps decode-uri-component from 0.2.0 to 0.2.2.

    Release notes

    Sourced from decode-uri-component's releases.

    v0.2.2

    • Prevent overwriting previously decoded tokens 980e0bf

    https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.1...v0.2.2

    v0.2.1

    • Switch to GitHub workflows 76abc93
    • Fix issue where decode throws - fixes #6 746ca5d
    • Update license (#1) 486d7e2
    • Tidelift tasks a650457
    • Meta tweaks 66e1c28

    https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.0...v0.2.1

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump copy-props from 2.0.4 to 2.0.5

    Bump copy-props from 2.0.4 to 2.0.5

    Bumps copy-props from 2.0.4 to 2.0.5.

    Release notes

    Sourced from copy-props's releases.

    2.0.5

    Fix

    • Avoids prototype pollution (#7)

    Doc

    • Update license years.
    • Transfer ownership to Gulp Team (#6)

    Build

    • Update dependencies: each-props (>=1.3.2), is-plain-object (>=5.0.0).

    Test

    • Expand test versions to v11〜v14.
    Changelog

    Sourced from copy-props's changelog.

    Changelog

    3.0.1 (2021-10-31)

    Bug Fixes

    • ci: Rename prettierignore typo & avoid formatting web (192badf)
    • Update dependencies (ba8a51c)

    3.0.0 (2021-09-25)

    ⚠ BREAKING CHANGES

    • Normalize repository, dropping node <10.13 support (#8)

    Miscellaneous Chores

    • Normalize repository, dropping node <10.13 support (#8) (85b1165)
    Commits
    • 40b7974 2.0.5
    • 2c738f5 Fix: Avoids prototype pollution (#7)
    • 4cac863 Merge: Transfer ownership to Gulp Team (#6)
    • 54a791d Doc: Transfer ownership to Gulp Team
    • 196fc9e Merge: Update dependencies and expand ci test versions (#5)
    • e89907f Test: Update npm to v4 when nodejs is v5 because of npm install error.
    • e970322 Test: Run coveralls when nodejs >= 6 because of its supports
    • 063e534 Test: Add nodejs v11-v14 into ci test versions
    • 72270af Doc: Update license years
    • f60b928 Build: Update versions of dependencies
    • See full diff in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump jsdom from 8.5.0 to 16.5.0

    Bump jsdom from 8.5.0 to 16.5.0

    Bumps jsdom from 8.5.0 to 16.5.0.

    Release notes

    Sourced from jsdom's releases.

    Version 16.5.0

    • Added window.queueMicrotask().
    • Added window.event.
    • Added inputEvent.inputType. (diegohaz)
    • Removed ondragexit from Window and friends, per a spec update.
    • Fixed the URL of about:blank iframes. Previously it was getting set to the parent's URL. (SimonMueller)
    • Fixed the loading of subresources from the filesystem when they had non-ASCII filenames.
    • Fixed the hidden="" attribute to cause display: none per the user-agent stylesheet. (ph-fritsche)
    • Fixed the new File() constructor to no longer convert / to :, per a pending spec update.
    • Fixed mutation observer callbacks to be called with the MutationObserver instance as their this value.
    • Fixed <input type=checkbox> and <input type=radio> to be mutable even when disabled, per a spec update.
    • Fixed XMLHttpRequest to not fire a redundant final progress event if a progress event was previously fired with the same loaded value. This would usually occur with small files.
    • Fixed XMLHttpRequest to expose the Content-Length header on cross-origin responses.
    • Fixed xhr.response to return null for failures that occur during the middle of the download.
    • Fixed edge cases around passing callback functions or event handlers. (ExE-Boss)
    • Fixed edge cases around the properties of proxy-like objects such as localStorage or dataset. (ExE-Boss)
    • Fixed a potential memory leak with custom elements (although we could not figure out how to trigger it). (soncodi)

    Version 16.4.0

    • Added a not-implemented warning if you try to use the second pseudo-element argument to getComputedStyle(), unless you pass a ::part or ::slotted pseudo-element, in which case we throw an error per the spec. (ExE-Boss)
    • Improved the performance of repeated access to el.tagName, which also indirectly improves performance of selector matching and style computation. (eps1lon)
    • Fixed form.elements to respect the form="" attribute, so that it can contain non-descendant form controls. (ccwebdesign)
    • Fixed el.focus() to do nothing on disconnected elements. (eps1lon)
    • Fixed el.focus() to work on SVG elements. (zjffun)
    • Fixed removing the currently-focused element to move focus to the <body> element. (eps1lon)
    • Fixed imgEl.complete to return true for <img> elements with empty or unset src="" attributes. (strager)
    • Fixed imgEl.complete to return true if an error occurs loading the <img>, when canvas is enabled. (strager)
    • Fixed imgEl.complete to return false if the <img> element's src="" attribute is reset. (strager)
    • Fixed the valueMissing validation check for <input type="radio">. (zjffun)
    • Fixed translate="" and draggable="" attribute processing to use ASCII case-insensitivity, instead of Unicode case-insensitivity. (zjffun)

    Version 16.3.0

    • Added firing of focusin and focusout when using el.focus() and el.blur(). (trueadm)
    • Fixed elements with the contenteditable="" attribute to be considered as focusable. (jamieliu386)
    • Fixed window.NodeFilter to be per-Window, instead of shared across all Windows. (ExE-Boss)
    • Fixed edge-case behavior involving use of objects with handleEvent properties as event listeners. (ExE-Boss)
    • Fixed a second failing image load sometimes firing a load event instead of an error event, when the canvas package is installed. (strager)
    • Fixed drawing an empty canvas into another canvas. (zjffun)

    Version 16.2.2

    • Updated StyleSheetList for better spec compliance; notably it no longer inherits from Array.prototype. (ExE-Boss)
    • Fixed requestAnimationFrame() from preventing process exit. This likely regressed in v16.1.0.
    • Fixed setTimeout() to no longer leak the closures passed in to it. This likely regressed in v16.1.0. (AviVahl)
    • Fixed infinite recursion that could occur when calling click() on a <label> element, or one of its descendants.
    • Fixed getComputedStyle() to consider inline style="" attributes. (eps1lon)
    • Fixed several issues with <input type="number">'s stepUp() and stepDown() functions to be properly decimal-based, instead of floating point-based.
    • Fixed various issues where updating selectEl.value would not invalidate properties such as selectEl.selectedOptions. (ExE-Boss)
    • Fixed <input>'s src property, and <ins>/<del>'s cite property, to properly reflect as URLs.
    • Fixed window.addEventLister, window.removeEventListener, and window.dispatchEvent to properly be inherited from EventTarget, instead of being distinct functions. (ExE-Boss)
    • Fixed errors that would occur if attempting to use a DOM object, such as a custom element, as an argument to addEventListener.

    ... (truncated)

    Changelog

    Sourced from jsdom's changelog.

    16.5.0

    • Added window.queueMicrotask().
    • Added window.event.
    • Added inputEvent.inputType. (diegohaz)
    • Removed ondragexit from Window and friends, per a spec update.
    • Fixed the URL of about:blank iframes. Previously it was getting set to the parent's URL. (SimonMueller)
    • Fixed the loading of subresources from the filesystem when they had non-ASCII filenames.
    • Fixed the hidden="" attribute to cause display: none per the user-agent stylesheet. (ph-fritsche)
    • Fixed the new File() constructor to no longer convert / to :, per a pending spec update.
    • Fixed mutation observer callbacks to be called with the MutationObserver instance as their this value.
    • Fixed <input type=checkbox> and <input type=radio> to be mutable even when disabled, per a spec update.
    • Fixed XMLHttpRequest to not fire a redundant final progress event if a progress event was previously fired with the same loaded value. This would usually occur with small files.
    • Fixed XMLHttpRequest to expose the Content-Length header on cross-origin responses.
    • Fixed xhr.response to return null for failures that occur during the middle of the download.
    • Fixed edge cases around passing callback functions or event handlers. (ExE-Boss)
    • Fixed edge cases around the properties of proxy-like objects such as localStorage or dataset. (ExE-Boss)
    • Fixed a potential memory leak with custom elements (although we could not figure out how to trigger it). (soncodi)

    16.4.0

    • Added a not-implemented warning if you try to use the second pseudo-element argument to getComputedStyle(), unless you pass a ::part or ::slotted pseudo-element, in which case we throw an error per the spec. (ExE-Boss)
    • Improved the performance of repeated access to el.tagName, which also indirectly improves performance of selector matching and style computation. (eps1lon)
    • Fixed form.elements to respect the form="" attribute, so that it can contain non-descendant form controls. (ccwebdesign)
    • Fixed el.focus() to do nothing on disconnected elements. (eps1lon)
    • Fixed el.focus() to work on SVG elements. (zjffun)
    • Fixed removing the currently-focused element to move focus to the <body> element. (eps1lon)
    • Fixed imgEl.complete to return true for <img> elements with empty or unset src="" attributes. (strager)
    • Fixed imgEl.complete to return true if an error occurs loading the <img>, when canvas is enabled. (strager)
    • Fixed imgEl.complete to return false if the <img> element's src="" attribute is reset. (strager)
    • Fixed the valueMissing validation check for <input type="radio">. (zjffun)
    • Fixed translate="" and draggable="" attribute processing to use ASCII case-insensitivity, instead of Unicode case-insensitivity. (zjffun)

    16.3.0

    • Added firing of focusin and focusout when using el.focus() and el.blur(). (trueadm)
    • Fixed elements with the contenteditable="" attribute to be considered as focusable. (jamieliu386)
    • Fixed window.NodeFilter to be per-Window, instead of shared across all Windows. (ExE-Boss)
    • Fixed edge-case behavior involving use of objects with handleEvent properties as event listeners. (ExE-Boss)
    • Fixed a second failing image load sometimes firing a load event instead of an error event, when the canvas package is installed. (strager)
    • Fixed drawing an empty canvas into another canvas. (zjffun)

    16.2.2

    • Updated StyleSheetList for better spec compliance; notably it no longer inherits from Array.prototype. (ExE-Boss)
    • Fixed requestAnimationFrame() from preventing process exit. This likely regressed in v16.1.0.
    • Fixed setTimeout() to no longer leak the closures passed in to it. This likely regressed in v16.1.0. (AviVahl)
    • Fixed infinite recursion that could occur when calling click() on a <label> element, or one of its descendants.
    • Fixed getComputedStyle() to consider inline style="" attributes. (eps1lon)
    • Fixed several issues with <input type="number">'s stepUp() and stepDown() functions to be properly decimal-based, instead of floating point-based.

    ... (truncated)

    Commits
    • 2d82763 Version 16.5.0
    • 9741311 Fix loading of subresources with Unicode filenames
    • 5e46553 Use domenic's ESLint config as the base
    • 19b35da Fix the URL of about:blank iframes
    • 017568e Support inputType on InputEvent
    • 29f4fdf Upgrade dependencies
    • e2f7639 Refactor create‑event‑accessor.js to remove code duplication
    • ff69a75 Convert JSDOM to use callback functions
    • 19df6bc Update links in contributing guidelines
    • 1e34ff5 Test triage
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump ajv from 6.10.2 to 6.12.6

    Bump ajv from 6.10.2 to 6.12.6

    Bumps ajv from 6.10.2 to 6.12.6.

    Release notes

    Sourced from ajv's releases.

    v6.12.6

    Fix performance issue of "url" format.

    v6.12.5

    Fix uri scheme validation (@​ChALkeR). Fix boolean schemas with strictKeywords option (#1270)

    v6.12.4

    Fix: coercion of one-item arrays to scalar that should fail validation (failing example).

    v6.12.3

    Pass schema object to processCode function Option for strictNumbers (@​issacgerges, #1128) Fixed vulnerability related to untrusted schemas (CVE-2020-15366)

    v6.12.2

    Removed post-install script

    v6.12.1

    Docs and dependency updates

    v6.12.0

    Improved hostname validation (@​sambauers, #1143) Option keywords to add custom keywords (@​franciscomorais, #1137) Types fixes (@​boenrobot, @​MattiAstedrone) Docs:

    v6.11.0

    Time formats support two digit and colon-less variants of timezone offset (#1061 , @​cjpillsbury) Docs: RegExp related security considerations Tests: Disabled failing typescript test

    Commits
    • fe59143 6.12.6
    • d580d3e Merge pull request #1298 from ajv-validator/fix-url
    • fd36389 fix: regular expression for "url" format
    • 490e34c docs: link to v7-beta branch
    • 9cd93a1 docs: note about v7 in readme
    • 877d286 Merge pull request #1262 from b4h0-c4t/refactor-opt-object-type
    • f1c8e45 6.12.5
    • 764035e Merge branch 'ChALkeR-chalker/fix-comma'
    • 3798160 Merge branch 'chalker/fix-comma' of git://github.com/ChALkeR/ajv into ChALkeR...
    • a3c7eba Merge branch 'refactor-opt-object-type' of github.com:b4h0-c4t/ajv into refac...
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump tar from 4.4.13 to 4.4.19

    Bump tar from 4.4.13 to 4.4.19

    Bumps tar from 4.4.13 to 4.4.19.

    Commits
    • 9a6faa0 4.4.19
    • 70ef812 drop dirCache for symlink on all platforms
    • 3e35515 4.4.18
    • 52b09e3 fix: prevent path escape using drive-relative paths
    • bb93ba2 fix: reserve paths properly for unicode, windows
    • 2f1bca0 fix: prune dirCache properly for unicode, windows
    • 9bf70a8 4.4.17
    • 6aafff0 fix: skip extract if linkpath is stripped entirely
    • 5c5059a fix: reserve paths case-insensitively
    • fd6accb 4.4.16
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
Releases(v0.15.20)
Reusable JavaScript library for creating sketchy/hand-drawn styled charts in the browser.

roughViz.js is a reusable JavaScript library for creating sketchy/hand-drawn styled charts in the browser, based on D3v5, roughjs, and handy. Why? Use

Jared Wilber 6.4k Jan 4, 2023
Smoothie Charts: smooooooth JavaScript charts for realtime streaming data

Smoothie Charts is a really small charting library designed for live streaming data. I built it to reduce the headaches I was getting from watching ch

Joe Walnes 2.2k Dec 13, 2022
📊 A highly interactive data-driven visualization grammar for statistical charts.

English | 简体中文 G2 A highly interactive data-driven visualization grammar for statistical charts. Website • Tutorial Docs • Blog • G2Plot G2 is a visua

AntV team 11.5k Dec 30, 2022
An open-source visualization library specialized for authoring charts that facilitate data storytelling with a high-level action-driven grammar.

Narrative Chart Introduction Narrative Chart is an open-source visualization library specialized for authoring charts that facilitate data storytellin

Narrative Chart 45 Nov 2, 2022
Repo for various Tesla internal data visualizations

teslarender Repo for various Tesla internal data visualizations $ http-server -g -c0 -p8899 Access at: http://localhost:8899/?http://fn.lc/s/depthre

Tristan Rice 29 Dec 15, 2022
A platform for creating interactive data visualizations

owid-grapher This is the project we use at Our World in Data to create embeddable visualizations like this one (click for interactive): ⚠️ This projec

Our World in Data 1.1k Jan 4, 2023
A framework for building reusable components with d3.js

Koto A framework for creating reusable charts with D3.js, written in ES6. Introduction KotoJS is HEAVILY inspired by another reusable charting framewo

KotoJS 280 Dec 23, 2022
Make Your Company Data Driven. Connect to any data source, easily visualize, dashboard and share your data.

Redash is designed to enable anyone, regardless of the level of technical sophistication, to harness the power of data big and small. SQL users levera

Redash 22.4k Dec 30, 2022
Synchro Charts is a front-end component library that provides a collection of components to visualize time-series data.

Synchro Charts Synchro Charts is a front-end component library that provides a collection of components to visualize time-series data. You can learn m

Amazon Web Services - Labs 60 Dec 29, 2022
A javascript library that extends D3.js to enable fast and beautiful visualizations.

d3plus D3plus is a JavaScript re-usable chart library that extends the popular D3.js to enable the easy creation of beautiful visualizations. Installi

D3plus 1.6k Dec 2, 2022
Interactive visualizations of time series using JavaScript and the HTML canvas tag

dygraphs JavaScript charting library The dygraphs JavaScript library produces interactive, zoomable charts of time series: Learn more about it at dygr

Dan Vanderkam 3k Jan 3, 2023
A web app that shows visualizations of the most used graphs algorithms such as BFS, DFS, Dijsktra, Minimum spanning tree, etc. It allows you to draw your own graph.

Graph Visualizer Draw your own graphs and visualize the most common graph algorithms This web application allows you to draw a graph from zero, with p

Gonzalo Pereira 31 Jul 29, 2022
Free Bootstrap 5 Admin and Dashboard Template that comes with all essential dashboard components, elements, charts, graph and application pages. Download now for free and use with personal or commercial projects.

PlainAdmin - Free Bootstrap 5 Dashboard Template PlainAdmin is a free and open-source Bootstrap 5 admin and dashboard template that comes with - all e

PlainAdmin 238 Dec 31, 2022
A reusable charting library written in d3.js

NVD3 - A reusable D3 charting library Inspired by the work of Mike Bostock's Towards Reusable Charts, and supported by a combined effort of Novus and

Novus 7.2k Jan 3, 2023
:bar_chart: A D3-based reusable chart library

c3 c3 is a D3-based reusable chart library that enables deeper integration of charts into web applications. Follow the link for more information: http

C3.js 9.2k Jan 2, 2023
React + Canvas = Love. JavaScript library for drawing complex canvas graphics using React.

React Konva React Konva is a JavaScript library for drawing complex canvas graphics using React. It provides declarative and reactive bindings to the

konva 4.9k Jan 9, 2023
Easily compose images together without messing around with canvas

merge-images Easily compose images together without messing around with canvas Canvas can be kind of a pain to work with sometimes, especially if you

Luke Childs 1.5k Dec 30, 2022
Progressive pie, donut, bar and line charts

Peity Peity (sounds like deity) is a jQuery plugin that converts an element's content into a mini <svg> pie, donut, line or bar chart. Basic Usage HTM

Ben Pickles 4.2k Jan 1, 2023
Ember Charts 3.5 2.3 L2 JavaScript A powerful and easy to use charting library for Ember.js

Ember Charts A charting library built with the Ember.js and d3.js frameworks. It includes time series, bar, pie, and scatter charts which are easy to

Addepar 793 Dec 7, 2022