Skip to content
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

三星S8图表echarts不显示 #85

Closed
yrjwcharm opened this issue Dec 1, 2022 · 10 comments
Closed

三星S8图表echarts不显示 #85

yrjwcharm opened this issue Dec 1, 2022 · 10 comments
Labels
Toolong No response for more than two weeks

Comments

@yrjwcharm
Copy link

No description provided.

@yrjwcharm
Copy link
Author

部分android机型不渲染求 在线救急呀

@moon-xt
Copy link

moon-xt commented Dec 2, 2022

贴代码

@supervons
Copy link
Owner

为了便于沟通,请先参考下 issue 规范:#6

@yrjwcharm
Copy link
Author

yrjwcharm commented Dec 2, 2022

@supervons 我感觉这个库里那个webview source用js注入html 属性的方式不靠谱

代码实例

const Example = () => {
    const myChart = useRef();
    const barOption = {
        // tooltip: {
        //     trigger: 'axis',
        //     axisPointer: {
        //         type: 'shadow',
        //     },
        // },
        grid: {left: 0, right: 0, bottom: 0, containLabel: true},
        animation: true, //设置动画效果
        animationEasing: 'linear',
        dataZoom: [
            {
                type: 'inside',
                zoomLock: true, //锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
                throttle: 100, //设置触发视图刷新的频率。单位为毫秒(ms)
            },
        ],
        xAxis: {
            nameLocation: 'end',
            show: false,
            inside: true, //刻度内置
            boundaryGap: true,
            type: 'category',
            axisTick: {
                show: false, // 不显示坐标轴刻度线
                alignWithLabel: true,
            },
            axisLabel: {
                // rotate: 70,
                boundaryGap: false,
                show: true, // 不显示坐标轴上的文字
                color: Colors.lightGrayColor,
                fontFamily: Font.numMedium,
                fontWeight: '500',
                fontSize: 9,
                align: 'left',
                margin: 8,
                showMaxLabel: true,
            },
            axisLine: {
                lineStyle: {
                    color: '#BDC2CC',
                    width: 0.5,
                },
            },
            data: ['2011-01-02', '2011-01-03'],
        },
        yAxis: {
            // scale: true,
            boundaryGap: false,
            type: 'value',
            // position: 'left',
            // min: minVal, // 坐标轴刻度最小值。
            // max: maxVal, // 坐标轴刻度最大值。
            splitNumber: 5, // 坐标轴的分割段数,是一个预估值,实际显示会根据数据稍作调整。
            // interval: interval, // 强制设置坐标轴分割间隔。
            axisLabel: {
                show: false, // 不显示坐标轴上的文字
                // margin: 0,
            },
            splitLine: {
                lineStyle: {
                    color: '#E9EAEF',
                    width: 0.5,
                },
                show: true,
            },
            axisLine: {
                show: false,
            },
            axisTick: {
                length: 5,
            },
        },
        series: [
            {
                large: true,
                largeThreshold: 1000,
                type: 'bar',
                barWidth: 6,
                // barGap: '8%',
                itemStyle: {
                    normal: {
                        color: function (params) {
                            //根据数值大小设置相关颜色
                            if (params.value > 0) {
                                return '#E74949';
                            } else {
                                return '#4BA471';
                            }
                        },
                    },
                },
                markPoint: {
                    symbol: 'circle',
                    symbolSize: 8,
                    label: {
                        show: false,
                    },
                    itemStyle: {
                        normal: {
                            color: Colors.red,
                            borderColor: Colors.white,
                            borderWidth: 1, // 标注边线线宽,单位px,默认为1
                        },
                    },
                    data: [],
                },
                data: [200, 300],
            },
        ],
    };
    return (
        <RNEChartsPro
            onDataZoom={(result, option) => {
                const {startValue} = option.dataZoom[0];
            }}
            legendSelectChanged={(result) => {}}
            onPress={(result) => {}}
            ref={myChart}
            width={deviceWidth - px(58)}
            height={px(300)}
            onMousemove={() => {}}
            onFinished={() => {}}
            onRendered={() => {}}
            option={barOption}
        />
    );
};
export default Example;
package.json 里

image

ios正常

image

android 三星 不显示。红米也不正常

image
image

@yrjwcharm
Copy link
Author

@supervons @XT-0515 尽快帮忙看下

@moon-xt
Copy link

moon-xt commented Dec 2, 2022

@supervons @XT-0515 尽快帮忙看下

webViewSettings={{androidLayerType: 'software'}}
试试?

@yrjwcharm
Copy link
Author

@supervons @XT-0515 尽快帮忙看下

webViewSettings={{androidLayerType: 'software'}} 试试?不好使

@yrjwcharm
Copy link
Author

yrjwcharm commented Dec 2, 2022

@supervons @XT-0515 这块问题是否参考这个? http://t.zoukankan.com/bruce-gou-p-9271969.html

@supervons
Copy link
Owner

可能同这个问题:#86

Android 6 版本浏览器内核对于 ES6 语法支持不全。

但是你的不渲染是部分不渲染还是都不渲染呢?可以告知下版本信息吗?

@supervons
Copy link
Owner

@yrjwcharm 解决了吗?
没有的话,提供下机型安卓版本信息,代码示例最好是一个单页面可运行的页面,移除自定义的JS引用。

@supervons supervons added the Toolong No response for more than two weeks label Feb 13, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Toolong No response for more than two weeks
Projects
None yet
Development

No branches or pull requests

3 participants