Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

plimerence/react-native-echarts

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

26 Commits

Repository files navigation

native-echarts

NPM Version npm License

install

$ npm install native-echarts --save

Usage

The Usage is complete consistent with Echarts

component props:

  • option (object): The option for echarts: Documentation
  • width (number): The width of the chart. The default value is the outer container width.
  • height (number): The height of the chart. The default value is 400.
import React, { Component } from 'react';
import {
 AppRegistry,
 StyleSheet,
 Text,
 View
} from 'react-native';
import Echarts from 'native-echarts';
export default class app extends Component {
 render() {
 const option = {
 title: {
 text: 'ECharts demo'
 },
 tooltip: {},
 legend: {
 data:['销量']
 },
 xAxis: {
 data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
 },
 yAxis: {},
 series: [{
 name: '销量',
 type: 'bar',
 data: [5, 20, 36, 10, 10, 20]
 }]
 };
 return (
 <Echarts option={option} height={300} />
 );
 }
}
AppRegistry.registerComponent('app', () => app);

##Example

run demo

cd example
npm install
npm start

IOS

Open the xcode project in the ios directory and click run

screenshots:

image

Android

Open the Android project in the android directory with Android Studio and click run.

screenshots:

image

License

native-echarts is released under the MIT license.

About

Echarts for react-native. The react-naitve chart.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • HTML 97.3%
  • JavaScript 1.4%
  • Other 1.3%

AltStyle によって変換されたページ (->オリジナル) /