zoukankan      html  css  js  c++  java
  • native-echarts 在安卓上无法显示出来

    1.native-echarts 的配置是百度echarts

    2.模拟器上试了很多次都显示不出来(具体不清楚,我的是这样)

    3.真机测试可以显示图表,以下是配置:

      a。将node_modules ative-echartssrccomponentsEcharts下的tpl.html复制到androidappsrcmainassets目录下,assets需要自己新建文件夹

      b。在node_modules ative-echartssrccomponentsEcharts下的index.js文件进行修改:

        

    import React, { Component } from 'react';
    import { WebView, View, StyleSheet, Platform } from 'react-native'; // 需要添加一个Platform
    import renderChart from './renderChart';
    import echarts from './echarts.min';


    export default class App extends Component {

    constructor(props) {
    super(props);
    this.setNewOption = this.setNewOption.bind(this);
    }


    componentWillReceiveProps(nextProps) {
    if(nextProps.option !== this.props.option) {
    this.refs.chart.reload();
    }
    }

    setNewOption(option) {
    this.refs.chart.postMessage(JSON.stringify(option));
    }

    render() {
    return (
    <View style={{flex: 1, height: this.props.height || 400,}}>
    <WebView
    ref="chart"
    scrollEnabled = {false}
    injectedJavaScript = {renderChart(this.props)}
    style={{
    height: this.props.height || 400,
    backgroundColor: this.props.backgroundColor || 'transparent'
    }}
    scalesPageToFit={Platform.OS !== 'ios'}
    originWhitelist={['*']}
    source={Platform.OS === 'ios' ? require('./tpl.html') : {uri:'file:///android_asset/tpl.html'}} // 这处需要修改
    onMessage={event => this.props.onPress ? this.props.onPress(JSON.parse(event.nativeEvent.data)) : null}
    />
    </View>
    );
    }
    }
  • 相关阅读:
    【编程开发】加密算法(MD5,RSA,DES)的解析
    【spring-quartz】 定时调度,时间设置
    IntelliJ IDEA 学习(六)内存设置
    Java中的Double类型计算
    货币金额的计算
    关系数据库设计三大范式【转】
    【服务器防护】WEB防护
    遮罩、警告框/弹框
    Java 中使用 UEditor 整理【待续。。。】
    order by 容易出现的bug记录
  • 原文地址:https://www.cnblogs.com/lude1994/p/10647842.html
Copyright © 2011-2022 走看看