Skip to content

echarts3D地球在pc端正常显示,在移动端显示不正常 #8995

@xiaolove

Description

@xiaolove

One-line summary [问题简述]

用echarts做了个3D的地球,按照官方的示例做的效果,在pc端用了很久,没有问题,当其在移动端加载的时候,并没有显示贴图。地球变成了黑色,国界轮廓等是白色线条。

Version & Environment [版本及环境]

  • ECharts version [ECharts 版本]:4.1
  • Browser version [浏览器类型和版本]:pc端没问题
  • phone model[手机型号]:小米6,iphone6

Expected behaviour [期望结果]

希望移动端加载地球时可以正常显示,不会出现上述问题

ECharts option [ECharts配置项]

                       //地球相关配置项
                        var  option = {
                            tooltip:{
                                trigger:'item',
                                formatter:function(params){
                                    return params.name;
                                }
                            },
                            viewControl:{
                                center:[]
                            },
                            backgroundColor: '#000',
                            globe: {
                                baseTexture: "imgs/world_1.jpg",
                                heightTexture: "imgs/world_2.jpg",
                                shading: 'color',
                                // environment: 'imgs/bg.jpg',
                                light: {
                                    main: {
                                        intensity:3,
                                    },
                                    ambient: {
                                        intensity:3
                                    },
                                },
                                viewControl: {
                                    autoRotate: false,
                                    targetCoord: [116.46, 39.92]
                                },
                                layers: [{
                                    type: 'blend',
                                    texture: echartsMap
                                }]
                            },  
                            series : [
                                {
                                    name:'',
                                    type: 'scatter3D',
                                    coordinateSystem: 'globe',
                                    data: markData,
                                    blendMode:'lighter',
                                    symbolSize: 10,
                                    hoverAnimation: true,
                                    label: {
                                        normal: {
                        //	                   formatter: '{c}',
                                            position: 'right',
                                            show: false
                                        },
                                        emphasis: {
                                            show: false
                                        }
                                    },
                                    itemStyle: {
                                        normal: {
                                                color:function(params){
                                                    if(params.data.idData.isAlarm){
                                                        return "red"
                                                    }else{
                                                        return "#05C3F9"
                                                    }
                                                }
                                        },
                                        emphasis: {
                                            color: 'yellow'
                                        }
                                    },
                                    animation:true
                                },
                            ]
                        }

Other comments [其他信息]

我们这个地球是一个单独的html页面,通过iframe引入到其它页面中,在pc端没有问题,到了移动端就显示不正常,如下图所示。第一张是Pc端,第二张是移动端。尝试过缩小图片,不行。请帮忙看看,望早日解决,谢谢。
map
_20180903100058

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions