react-d3/react-visual-graphic

Name: react-visual-graphic

Owner: react-d3

Description: visualization packages

Created: 2015-12-05 12:24:05.0

Updated: 2017-01-31 12:05:34.0

Pushed: 2015-12-15 09:42:06.0

Homepage: null

Size: 21

Language: JavaScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

react-visual-graphic

react visual graphic collections.

Quick example

Tag

 strict";

React = require('react');
ReactDOM = require('react-dom');

Tag = require('react-visual-graphic').Tag;

xample
ction() {

actDOM.render(
<div>
  <svg width= {300} height= {300}>
    <Tag
      width= {200}
      height= {80}
      text= {"Hello world!"}
      color= {"green"}
      textColor= {"#FFF"}
      />
  </svg>
</div>
document.getElementById('blank-tag')

Battery

 strict";

React = require('react');
ReactDOM = require('react-dom');

Battery = require('react-visual-graphic').Battery;

xample
ction() {

actDOM.render(
<div>
  <svg width= {300} height= {300}>
    <Battery
      width= {200}
      height= {100}
      maxVal= {100}
      value= {30}
      color= {"green"}
      batteryColor= {"#CCC"}
      />
  </svg>
</div>
document.getElementById('blank-battery')

Meter

 strict";

React = require('react');
ReactDOM = require('react-dom');

Meter = require('../../lib/index').Meter;

xample
ction() {

actDOM.render(
<div>
  <svg width= {300} height= {400}>
    <Meter
      width= {150}
      height= {400}
      maxVal= {100}
      value= {30}
      color= {"blue"}
      meterColor= {"#CCC"}
      text= {"30%"}
      />
  </svg>
</div>
document.getElementById('blank-meter')

License

Apache 2.0