grizzly_vizdom 0.0.3-dev

  • README.md
  • CHANGELOG.md
  • Installing
  • Versions
  • 49

VizDOM

Fluent data driven documents based selection and data-join API for HTML DOM

Examples

Selection

TBD

Transition

Control

void main() {
  final anim = new AnimationBuilder().duration(120000).fillForwards()
    ..createAt(0.0).translateX(0)
    ..createAt(1.0).translateX(1000);

  select('#root')
      .selectAll('div')
      .style('background-color', 'red')
      .transition('anim1')
      .animateWithBuilder(anim);

  querySelector('#btn-cancel').onClick.listen((_) {
    select('#root').selectAll('div').transition('anim1').cancel();
  });

  querySelector('#btn-start').onClick.listen((_) {
    select('#root')
        .selectAll('div')
        .transition('anim1')
        .animateWithBuilder(anim);
  });

  querySelector('#btn-reverse').onClick.listen((_) {
    select('#root').selectAll('div').transition('anim1').reverse();
  });

  querySelector('#btn-finish').onClick.listen((_) {
    select('#root').selectAll('div').transition('anim1').finish();
  });

  querySelector('#btn-pause').onClick.listen((_) {
    select('#root').selectAll('div').transition('anim1').pause();
  });

  querySelector('#btn-play').onClick.listen((_) {
    select('#root').selectAll('div').transition('anim1').play();
  });
}

TODO

Selection

  • [ ] Bound data must be separate for each group
  • [ ] insertBound in BoundSelection
  • [ ] Lower
  • [ ] Raise
  • [ ] forEach
  • [ ] filter
  • [ ] size
  • [ ] non-null size
  • [ ] Events

Transition

  • [ ] active
  • [ ] chain

SVG

  • [ ] svg
  • [ ] Line
  • [ ] Group

Changelog

0.0.3

  • Chained and simultaneous transitions
  • Bound transitions

0.0.2

  • cancel, play, pause, finish, reverse methods on Transition

0.0.1

  • Initial version, created by Stagehand

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  grizzly_vizdom: "^0.0.3-dev"

2. Install it

You can install packages from the command line:

with pub:


$ pub get

Alternatively, your editor might support pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:grizzly_vizdom/grizzly_vizdom.dart';
        
Version Uploaded Documentation Archive
0.0.3-dev Aug 28, 2017 Go to the documentation of grizzly_vizdom 0.0.3-dev Download grizzly_vizdom 0.0.3-dev archive
0.0.2-dev Aug 27, 2017 Go to the documentation of grizzly_vizdom 0.0.2-dev Download grizzly_vizdom 0.0.2-dev archive
0.0.1-dev Aug 26, 2017 Go to the documentation of grizzly_vizdom 0.0.1-dev Download grizzly_vizdom 0.0.1-dev archive

Analysis

This feature is new.
We welcome feedback.
More details: scoring.

We analyzed this package, and provided a score, details, and suggestions below.

  • completed on Feb 3, 2018
  • Dart: 2.0.0-dev.20.0
  • pana: 0.10.1

Scores

Popularity:
Describes how popular the package is relative to other packages. [more]
0 / 100
Health:
Code health derived from static analysis. [more]
99 / 100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
98 / 100
Overall score:
Weighted score of the above. [more]
49

Platforms

Detected platforms: web

Primary library: package:grizzly_vizdom/grizzly_vizdom.dart with components: html.

Suggestions

  • Package is pre-release.

    Pre-release versions should be used with caution, their API may change in breaking ways.

  • Package is pre-v1 release.

    While there is nothing inherently wrong with versions of 0.*.*, it usually means that the author is still experimenting with the general direction API.

  • Maintain an example.

    Create a short demo in the example/ directory to show how to use this package. Common file name patterns include: main.dart, example.dart or you could also use grizzly_vizdom.dart.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=1.20.1 <2.0.0
animation_builder ^0.0.5 0.0.5
Dev dependencies
browser ^0.10.0
dart_to_js_script_rewriter ^1.0.1