New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

debug正常,但是release还是不显示,我的rn是0.38 #12

Closed
WhatAKitty opened this Issue Dec 3, 2016 · 39 comments

Comments

Projects
None yet
@WhatAKitty

WhatAKitty commented Dec 3, 2016

No description provided.

@WhatAKitty

This comment has been minimized.

Show comment
Hide comment
@WhatAKitty

WhatAKitty Dec 4, 2016

我把它升级成0.39,但是打包还是不行

WhatAKitty commented Dec 4, 2016

我把它升级成0.39,但是打包还是不行

@ztMalone

This comment has been minimized.

Show comment
Hide comment
@ztMalone

ztMalone Dec 7, 2016

真的感谢这个组件,但是release版本真机测试也是无法显示图标,react-native版本是0.34,急求修复

ztMalone commented Dec 7, 2016

真的感谢这个组件,但是release版本真机测试也是无法显示图标,react-native版本是0.34,急求修复

@somonus

This comment has been minimized.

Show comment
Hide comment
@somonus

somonus Dec 7, 2016

Owner

这是react-native的一个bug,解决方案参考facebook/react-native#6004

Owner

somonus commented Dec 7, 2016

这是react-native的一个bug,解决方案参考facebook/react-native#6004

@1610449813

This comment has been minimized.

Show comment
Hide comment
@1610449813

1610449813 Dec 7, 2016

release版本只能使用uri加载资源,android把tpl.html文件放在android/app/src/main/assets文件里,使用uri:'file:///android_asset/tpl.html'这个地址加载,ios在项目目录下建个文件夹,把tpl文件放里面去,使用uri:'文件名/tpl'加载,这样能使用,但是好像无法使用webview和native见得通信

1610449813 commented Dec 7, 2016

release版本只能使用uri加载资源,android把tpl.html文件放在android/app/src/main/assets文件里,使用uri:'file:///android_asset/tpl.html'这个地址加载,ios在项目目录下建个文件夹,把tpl文件放里面去,使用uri:'文件名/tpl'加载,这样能使用,但是好像无法使用webview和native见得通信

@1610449813

This comment has been minimized.

Show comment
Hide comment
@1610449813

1610449813 Dec 8, 2016

无法通信找到解决方法了,但是无法使用官方自己的webview,我使用react-native-webview-bridge这个,打包时忽略这个组建的webview方法就行了

1610449813 commented Dec 8, 2016

无法通信找到解决方法了,但是无法使用官方自己的webview,我使用react-native-webview-bridge这个,打包时忽略这个组建的webview方法就行了

@ztMalone

This comment has been minimized.

Show comment
Hide comment
@ztMalone

ztMalone Dec 8, 2016

@1610449813 这个问题解决了么,要我自己去改写这个组件么?

ztMalone commented Dec 8, 2016

@1610449813 这个问题解决了么,要我自己去改写这个组件么?

@WhatAKitty WhatAKitty closed this Dec 8, 2016

@1610449813

This comment has been minimized.

Show comment
Hide comment
@1610449813

1610449813 Dec 8, 2016

@ztMalone 恩,如果你不需要webview和native通信,可以使用原生的webview,把他组件里Echarts文件夹的index文件webview source路径改成我上面说的,要是需要通信的话,使用我上面说的第三方组件

1610449813 commented Dec 8, 2016

@ztMalone 恩,如果你不需要webview和native通信,可以使用原生的webview,把他组件里Echarts文件夹的index文件webview source路径改成我上面说的,要是需要通信的话,使用我上面说的第三方组件

@lin493369

This comment has been minimized.

Show comment
Hide comment
@lin493369

lin493369 commented Jan 4, 2017

facebook/react-native#505
参考 @1610449813 的答案。已解决!

@huzhiqi

This comment has been minimized.

Show comment
Hide comment
@huzhiqi

huzhiqi Jan 10, 2017

按照@1610449813 的方法还是没有解决

huzhiqi commented Jan 10, 2017

按照@1610449813 的方法还是没有解决

@Rylai-Zihang

This comment has been minimized.

Show comment
Hide comment
@Rylai-Zihang

Rylai-Zihang Jan 17, 2017

@1610449813 android release版本通过“把tpl.html文件放在android/app/src/main/assets文件里,使用uri:'file:///android_asset/tpl.html'这个地址加载”已解决!但是IOS下将tpl.html放在项目的一个新建文件夹下,在报URL was not found 的错误,大家都有遇到吗?

Rylai-Zihang commented Jan 17, 2017

@1610449813 android release版本通过“把tpl.html文件放在android/app/src/main/assets文件里,使用uri:'file:///android_asset/tpl.html'这个地址加载”已解决!但是IOS下将tpl.html放在项目的一个新建文件夹下,在报URL was not found 的错误,大家都有遇到吗?

@belynnyond

This comment has been minimized.

Show comment
Hide comment
@belynnyond

belynnyond Feb 7, 2017

@Rylai-Zihang 大兄弟,你这个问题解决了么

belynnyond commented Feb 7, 2017

@Rylai-Zihang 大兄弟,你这个问题解决了么

@wangchongwei

This comment has been minimized.

Show comment
Hide comment
@wangchongwei

wangchongwei Feb 24, 2017

@1610449813 请问一下如何实现echarts和native的通信?
点击事件?要如何设置,在html中吗?

wangchongwei commented Feb 24, 2017

@1610449813 请问一下如何实现echarts和native的通信?
点击事件?要如何设置,在html中吗?

@ztMalone

This comment has been minimized.

Show comment
Hide comment
@ztMalone

ztMalone Feb 24, 2017

ztMalone commented Feb 24, 2017

@1610449813

This comment has been minimized.

Show comment
Hide comment
@1610449813

1610449813 Feb 24, 2017

看看echarts api,再看看react-native-webview-bridge就知道如何通信了,

1610449813 commented Feb 24, 2017

看看echarts api,再看看react-native-webview-bridge就知道如何通信了,

@lsamio

This comment has been minimized.

Show comment
Hide comment
@lsamio

lsamio Mar 1, 2017

@1610449813 ios按上面解决方法 source={{uri:'app/tpl'}}显示URL was not found on this server 请问怎么解决

lsamio commented Mar 1, 2017

@1610449813 ios按上面解决方法 source={{uri:'app/tpl'}}显示URL was not found on this server 请问怎么解决

@gongchao

This comment has been minimized.

Show comment
Hide comment
@gongchao

gongchao Mar 3, 2017

@lsamio +1,请问这个问题解决了吗?

gongchao commented Mar 3, 2017

@lsamio +1,请问这个问题解决了吗?

@ZhouYongfan

This comment has been minimized.

Show comment
Hide comment
@ZhouYongfan

ZhouYongfan Mar 3, 2017

npm install native-echarts --save之后一直下载不了,卡在loadRequestedDeps: still install loadDepsIntoIdealTree

ZhouYongfan commented Mar 3, 2017

npm install native-echarts --save之后一直下载不了,卡在loadRequestedDeps: still install loadDepsIntoIdealTree

@hanhui

This comment has been minimized.

Show comment
Hide comment
@hanhui

hanhui Jun 13, 2017

@1610449813 请问在您的android真机release版本的APK无法显示echarts图片的解决办法中,下面代码是修改的哪个地方的代码?
uri:'file:///android_asset/tpl.html'

hanhui commented Jun 13, 2017

@1610449813 请问在您的android真机release版本的APK无法显示echarts图片的解决办法中,下面代码是修改的哪个地方的代码?
uri:'file:///android_asset/tpl.html'

@hanhui

This comment has been minimized.

Show comment
Hide comment
@hanhui

hanhui Jun 13, 2017

@1610449813 已解决,修改的是 \node_modules\native-echarts\src\components\Echarts\index.js中的代码,具体如下:
源代码为:source={require('./tpl.html')}
修改为:source={{uri:'file:///android_asset/tpl.html'}}

hanhui commented Jun 13, 2017

@1610449813 已解决,修改的是 \node_modules\native-echarts\src\components\Echarts\index.js中的代码,具体如下:
源代码为:source={require('./tpl.html')}
修改为:source={{uri:'file:///android_asset/tpl.html'}}

@linfeizhang

This comment has been minimized.

Show comment
Hide comment
@linfeizhang

linfeizhang Jul 18, 2017

我这边修改过代码后还是不显示啊!source={{uri:'file:///android_asset/tpl.html'}},并且把tpl.html放到android/app/src/main/assets里了,但是还是不行啊,求解答啊!我这饼图可以正常显示,折线图就不行

linfeizhang commented Jul 18, 2017

我这边修改过代码后还是不显示啊!source={{uri:'file:///android_asset/tpl.html'}},并且把tpl.html放到android/app/src/main/assets里了,但是还是不行啊,求解答啊!我这饼图可以正常显示,折线图就不行

@Hgq1001

This comment has been minimized.

Show comment
Hide comment
@Hgq1001

Hgq1001 Jul 30, 2017

同路上一样 照着方法做了 饼图可以显示 仪表盘图可以显示 其他图就不行了 怎么解决啊 求大神指点

Hgq1001 commented Jul 30, 2017

同路上一样 照着方法做了 饼图可以显示 仪表盘图可以显示 其他图就不行了 怎么解决啊 求大神指点

@will86

This comment has been minimized.

Show comment
Hide comment
@will86

will86 Sep 8, 2017

Contributor

@gongchao @lsamio @Rylai-Zihang @belynnyond iOS的路径怎么放置,麻烦提示一下好吗,谢谢

Contributor

will86 commented Sep 8, 2017

@gongchao @lsamio @Rylai-Zihang @belynnyond iOS的路径怎么放置,麻烦提示一下好吗,谢谢

@zhangyanf

This comment has been minimized.

Show comment
Hide comment
@zhangyanf

zhangyanf Sep 11, 2017

@will86 @Hgq1001 你们看看你们的代码,trigger: 'axis',这个值是不是这个,不是的话改下,echart3.0,和echart2.0,有变化了,你们可以去官网查查代码,如果你们写的值是‘Time’的话,在Debug上可以显示,但是release上就显示不了了 ,

zhangyanf commented Sep 11, 2017

@will86 @Hgq1001 你们看看你们的代码,trigger: 'axis',这个值是不是这个,不是的话改下,echart3.0,和echart2.0,有变化了,你们可以去官网查查代码,如果你们写的值是‘Time’的话,在Debug上可以显示,但是release上就显示不了了 ,

@zwyqz

This comment has been minimized.

Show comment
Hide comment
@zwyqz

zwyqz Sep 14, 2017

目前我的解决方法
ios需要把tpl.html文件放到src/commonents/Echarts 里面
然后android 按照楼上的所说就行了
import { Platform } from 'react-native';

const source = (Platform.OS == 'ios') ? require('./tpl.html') : {'uri':'file:///android_asset/tpl.html'}
console.log("source=",source);
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,
      }}
      source={source}
    />
  </View>
);

zwyqz commented Sep 14, 2017

目前我的解决方法
ios需要把tpl.html文件放到src/commonents/Echarts 里面
然后android 按照楼上的所说就行了
import { Platform } from 'react-native';

const source = (Platform.OS == 'ios') ? require('./tpl.html') : {'uri':'file:///android_asset/tpl.html'}
console.log("source=",source);
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,
      }}
      source={source}
    />
  </View>
);
@zhangyanf

This comment has been minimized.

Show comment
Hide comment
@zhangyanf

zhangyanf Sep 14, 2017

你看看代码里的option,里边的trigger:的值是axis吗?

zhangyanf commented Sep 14, 2017

你看看代码里的option,里边的trigger:的值是axis吗?

@zwyqz

This comment has been minimized.

Show comment
Hide comment
@zwyqz

zwyqz Sep 14, 2017

trigger: 'item',

zwyqz commented Sep 14, 2017

trigger: 'item',

@zhangyanf

This comment has been minimized.

Show comment
Hide comment
@zhangyanf

zhangyanf Sep 14, 2017

你好好看看echart 3.0 和echart 2.0 的option是不一样的

zhangyanf commented Sep 14, 2017

你好好看看echart 3.0 和echart 2.0 的option是不一样的

@gaozhaopei

This comment has been minimized.

Show comment
Hide comment
@gaozhaopei

gaozhaopei Oct 12, 2017

@zwyqz 我的柱状图 设置宽度不起作用 总是占据两个屏宽 有什么解决办法吗 谢谢

gaozhaopei commented Oct 12, 2017

@zwyqz 我的柱状图 设置宽度不起作用 总是占据两个屏宽 有什么解决办法吗 谢谢

@simonguo

This comment has been minimized.

Show comment
Hide comment
@simonguo

simonguo Nov 9, 2017

@wangchongwei @1610449813 通讯可以使用 onMessage

WebView 上设置一个 onMessage , 然后在 option 里面中的 function 中 可以通过 window.postMessage 传值。

simonguo commented Nov 9, 2017

@wangchongwei @1610449813 通讯可以使用 onMessage

WebView 上设置一个 onMessage , 然后在 option 里面中的 function 中 可以通过 window.postMessage 传值。

@amijabd

This comment has been minimized.

Show comment
Hide comment
@amijabd

amijabd Jan 26, 2018

Please explain why need to modify:

Source = {require ('./tpl.html')}

to

Modify Is: source = {{uri: 'file: ///android_asset/tpl.html'}}

and where do I modify this?

amijabd commented Jan 26, 2018

Please explain why need to modify:

Source = {require ('./tpl.html')}

to

Modify Is: source = {{uri: 'file: ///android_asset/tpl.html'}}

and where do I modify this?

@will86

This comment has been minimized.

Show comment
Hide comment
@will86

will86 Jan 26, 2018

Contributor

@amijabd
The component WebView powered by Facebook requires that modify...

File of this path ./node_modules/native-echarts/src/components/Echarts/index.js needs to be modified

Contributor

will86 commented Jan 26, 2018

@amijabd
The component WebView powered by Facebook requires that modify...

File of this path ./node_modules/native-echarts/src/components/Echarts/index.js needs to be modified

@amijabd

This comment has been minimized.

Show comment
Hide comment
@amijabd

amijabd Jan 29, 2018

Yes, I made those changes based on the above by putting this:
source = {{uri: 'file: ///android_asset/tpl.html'}}

Still after I made a release, the charts still can't be viewed. Not sure what I'm doing wrong.

*When running the emulator, the chart no longer show after the modified code was made.

amijabd commented Jan 29, 2018

Yes, I made those changes based on the above by putting this:
source = {{uri: 'file: ///android_asset/tpl.html'}}

Still after I made a release, the charts still can't be viewed. Not sure what I'm doing wrong.

*When running the emulator, the chart no longer show after the modified code was made.

@amijabd

This comment has been minimized.

Show comment
Hide comment
@amijabd

amijabd Jan 30, 2018

Here's the page I did for one of the charts. Not sure where I'm going wrong.

import React, { Component } from 'react';
import { Container, Header, Content, Card, CardItem, Text, Body, Left, Right, Button, H3 } from 'native-base';
import Echarts from 'native-echarts';
export default class SalesProDepartment extends Component {
  render() {
    const option = {
    title : {
        show: true,
        text: 'Product Department',
        subtext: 'Mar 24-Sept 30, 2016',
        x:'center'
    },
    tooltip : {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
        orient: 'horizontal',
        bottom: 'bottom',
        data: [
          "-",
          "F-F&B",
          "R-Retail"
        ]
    },
    series : [
        {
            name: 'Department',
            type: 'pie',
            xAxis: '',
            yAxis: '',
            radius: [0, '50%'],
            data:[
              {name: "-", value: 12198.53},
              {name: "F-F&B", value: 26559.58},
              {name: "R-Retail", value: 29900.57}
            ],
            itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};
    return (
      <Container>
        <Content padder>
          <Card>
            <CardItem>
              <Button bordered small style={{marginRight: 10}}>
                <Text>Department</Text>
              </Button>
              <Button bordered small>
                <Text>Net Sales</Text>
              </Button>
            </CardItem>
          </Card>
          <Card style={{height:450}}>
            <CardItem>
              <Body>
                <Echarts option={option} height={400} width={350} />
              </Body>
            </CardItem>
         </Card>
        </Content>
      </Container>
    );
  }
}

amijabd commented Jan 30, 2018

Here's the page I did for one of the charts. Not sure where I'm going wrong.

import React, { Component } from 'react';
import { Container, Header, Content, Card, CardItem, Text, Body, Left, Right, Button, H3 } from 'native-base';
import Echarts from 'native-echarts';
export default class SalesProDepartment extends Component {
  render() {
    const option = {
    title : {
        show: true,
        text: 'Product Department',
        subtext: 'Mar 24-Sept 30, 2016',
        x:'center'
    },
    tooltip : {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
        orient: 'horizontal',
        bottom: 'bottom',
        data: [
          "-",
          "F-F&B",
          "R-Retail"
        ]
    },
    series : [
        {
            name: 'Department',
            type: 'pie',
            xAxis: '',
            yAxis: '',
            radius: [0, '50%'],
            data:[
              {name: "-", value: 12198.53},
              {name: "F-F&B", value: 26559.58},
              {name: "R-Retail", value: 29900.57}
            ],
            itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};
    return (
      <Container>
        <Content padder>
          <Card>
            <CardItem>
              <Button bordered small style={{marginRight: 10}}>
                <Text>Department</Text>
              </Button>
              <Button bordered small>
                <Text>Net Sales</Text>
              </Button>
            </CardItem>
          </Card>
          <Card style={{height:450}}>
            <CardItem>
              <Body>
                <Echarts option={option} height={400} width={350} />
              </Body>
            </CardItem>
         </Card>
        </Content>
      </Container>
    );
  }
}
@will86

This comment has been minimized.

Show comment
Hide comment
@will86

will86 Jan 30, 2018

Contributor

@amijabd
Confirm that, does the file tpl.html exists in the path ./android/app/src/main/assets/tpl.html?

Contributor

will86 commented Jan 30, 2018

@amijabd
Confirm that, does the file tpl.html exists in the path ./android/app/src/main/assets/tpl.html?

@amijabd

This comment has been minimized.

Show comment
Hide comment
@amijabd

amijabd Jan 30, 2018

Nope. Its not there. I did the bundling but its not there.

There is however a file in /android/app/src/main/res/raw with the name node_modules_nativeecharts_src_components_echarts_tpl.html

amijabd commented Jan 30, 2018

Nope. Its not there. I did the bundling but its not there.

There is however a file in /android/app/src/main/res/raw with the name node_modules_nativeecharts_src_components_echarts_tpl.html

@amijabd

This comment has been minimized.

Show comment
Hide comment
@amijabd

amijabd Jan 30, 2018

@will86
Okay. Managed to figure it out. Thanks for the assist.

amijabd commented Jan 30, 2018

@will86
Okay. Managed to figure it out. Thanks for the assist.

@priyankverma

This comment has been minimized.

Show comment
Hide comment
@priyankverma

priyankverma Feb 27, 2018

@amijabd I have exactly the same problem, how you fixed the problem?

priyankverma commented Feb 27, 2018

@amijabd I have exactly the same problem, how you fixed the problem?

@dongyuekai

This comment has been minimized.

Show comment
Hide comment
@dongyuekai

dongyuekai Aug 6, 2018

我这边遇到一个问题 加载china map的时候,在安卓上一切OK,在iOS上 模拟器正常,连线跑到真机上一切正常,release出ipa包后装到手机上就不显示了,最后找到了原因是因为html模板加载路径问题,解决办法如下:
1.在项目全局运行npm run bundle-ios
2.我把html中引用的加载js路径不正确的js文件直接拷贝到了html中,这样不存在路径问题了
经验证,iOS的release模式可以显示出来了

dongyuekai commented Aug 6, 2018

我这边遇到一个问题 加载china map的时候,在安卓上一切OK,在iOS上 模拟器正常,连线跑到真机上一切正常,release出ipa包后装到手机上就不显示了,最后找到了原因是因为html模板加载路径问题,解决办法如下:
1.在项目全局运行npm run bundle-ios
2.我把html中引用的加载js路径不正确的js文件直接拷贝到了html中,这样不存在路径问题了
经验证,iOS的release模式可以显示出来了

@yangmingfa

This comment has been minimized.

Show comment
Hide comment
@yangmingfa

yangmingfa Sep 16, 2018

iOS的release包下图标无法显示,在项目下建立文件夹来存放tpl.html也是不行,android的配置可以了,求各位大佬指点下iOS的路径到底要怎么配置?

yangmingfa commented Sep 16, 2018

iOS的release包下图标无法显示,在项目下建立文件夹来存放tpl.html也是不行,android的配置可以了,求各位大佬指点下iOS的路径到底要怎么配置?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment