echarts 3DMap散点图位置错误

hs1rzwqc 于 2022-10-23 发布在 Echarts

关注(0)|答案(4)|浏览(602)

One-line summary [问题简述]

3DMap散点图位置错误，并且scatter3D和lines3D同时使用时，lines3D无法显示

Version & Environment [版本及环境]

ECharts version [ECharts 4.0.2，ECharts GL 1.0.1]:
Browser version [Chrome，Firefox]:
OS Version [Win10]:

Expected behaviour [期望结果]

实现3DMap上散点图之间发散效果

ECharts option [ECharts配置项]

option = {
            geo3D: {
                map: 'china',
                roam: false,
                itemStyle: {
                    color: '#1d5e98',
                    opacity: 1,
                    borderWidth: 0.4,
                    borderColor: '#000'
                },
                label: {
                    show: true,
                    textStyle: {
                        color: '#000',
                        fontSize: 12,
                        opacity: 1,
                        backgroundColor: 'rgba(0,23,11,0)'
                    },
                },
                light: {
                    main: {
                        color: '#fff',
                        intensity: 1.2,
                        shadow: false,
                        alpha: 55,
                        beta: 10

                    },
                    ambient: {
                        intensity: 0.3
                    }
                },
                viewControl: {
                    distance: 100,
                    alpha: 50
                }
            },
            series: [
                {
                    name: "event",
                    type: 'scatter3D',
                    coordinateSystem: 'geo3D',
                    symbolSize: 20,
                    data: [{
                        value: [121.4648, 31.2891, 100]
                    }, {
                        value: [116.4551, 40.2539, 80]
                    }]
                },
                {
                    name: "eventline",
                    type: 'lines3D',
                    coordinateSystem: 'geo3D',
                    effect: {
                        show: true,
                        trailWidth: 1,
                        trailOpacity: 0.5,
                        trailLength: 0.2,
                        constantSpeed: 5
                    },

                    blendMode: 'lighter',

                    lineStyle: {
                        width: 1,
                        opacity: 1
                    },

                    data: [
                        [[121.4648, 31.2891], [116.4551, 40.2539]]
                    ]
                }
            ]
     };

echarts

来源：https://github.com/apache/echarts/issues/7814

4条答案

按热度按时间

ukxgm1gy1#

我也有这个问题请问如何解决

赞(0）回复(0）举报 2022-10-23

6yoyoihd2#

scatter3D+geo3D 也有类似问题，气泡图高度不一致，有些直接显示一半在Map里。

赞(0）回复(0）举报 2022-10-23

q3aa05253#

@chengang0621@oujiaru@fanslin
3D中的散点图，有个高度因素，这个因素是根据data中的第三个数值来决定的，数据小就埋在了Map里面了。也就是球的高度小于球的半径了。

{
type: 'scatter3D',
data: [
  [.., .., 1],     // 高度会很低
  [.., .., 100] 
]
}

所以，可以统一一下 data 中的第三个数值，使其保证高度大于半径就好

{
type: 'scatter3D',
data: [
  [.., .., 80, 1],     // 把高度抬高
  [.., .., 80, 100] 
]
},
// 设置球的半径大小，如果需要的话
symbolSize (val) {
  return val[3] // val中的第三个数是80， 第四个是原始的数值
}

赞(0）回复(0）举报 2022-10-23

jqjz2hbq4#

{
type: 'scatter3D',
data: [
  [.., .., 1],     // 高度会很低
  [.., .., 100] 
]
}

所以，可以统一一下 data 中的第三个数值，使其保证高度大于半径就好

{
type: 'scatter3D',
data: [
  [.., .., 80, 1],     // 把高度抬高
  [.., .., 80, 100] 
]
},
// 设置球的半径大小，如果需要的话
symbolSize (val) {
  return val[3] // val中的第三个数是80， 第四个是原始的数值
}

在版本5.0.2这个版本,这个方法并不行

赞(0）回复(0）举报 2022-10-23

我来回答

echarts 3DMap散点图位置错误

One-line summary [问题简述]

Version & Environment [版本及环境]

Expected behaviour [期望结果]

ECharts option [ECharts配置项]

4条答案

相关问题

热门标签

最新问答