首页新闻找找看学习计划

ECharts散点图点可以给点坐标[x,y]标识不同的名称吗

0
悬赏园豆:15 [已解决问题] 解决于 2016-08-03 14:13

需求是这样的:散点图上分布的每个点对应一个地区的查询出的两个结果集,能否实现当指向某个点的时候可以显示该地区的名称。具体描述如下图所示:

ECharts如果不能解决,还有其他解决方案嘛,谢谢!

Esofar的主页 Esofar | 初学一级 | 园豆:154
提问于:2016-08-03 09:53
< >
分享
最佳答案
0

http://echarts.baidu.com/demo.html#scatter-aqi-color

你看这个例子,他自定义了tooltip

tooltip: {
padding: 10,
backgroundColor: '#222',
borderColor: '#777',
borderWidth: 1,
formatter: function (obj) {
var value = obj.value;
return '<div style="border-bottom: 1px solid rgba(255,255,255,.3); font-size: 18px;padding-bottom: 7px;margin-bottom: 7px">'
+ obj.seriesName + ' ' + value[0] + '日:'
+ value[7]
+ '</div>'
+ schema[1].text + ':' + value[1] + '<br>'
+ schema[2].text + ':' + value[2] + '<br>'
+ schema[3].text + ':' + value[3] + '<br>'
+ schema[4].text + ':' + value[4] + '<br>'
+ schema[5].text + ':' + value[5] + '<br>'
+ schema[6].text + ':' + value[6] + '<br>';
}
},

收获园豆:15
刘宏玺 | 专家六级 |园豆:14004 | 2016-08-03 10:06

非常感谢,问题已解决。参照您给的示例和这个官方示例,知道了散点图series.data[i]的值原来不止是可以接受[x,y]二维数组。初次使用ECharts,可能很多东西不了解。

解决方案:在后台构造回传 [ 18.82, 345.29, "坐标标题" ] 格式的数据,ECharts提示框组件option.tooltip下 formatter(params)方法通过params.value[2]获取即可。

formatter: function (params) {
                if (params.value.length > 1) {
                    return "站点:" + params.value[2] +
                    "<br />NH4:" + params.value[0] + ' mg/m<sup>3</sup><br />COD:'
                       + params.value[1] + ' mg/m<sup>3</sup>';
                }
                else {
                    return params.name + ' : ' + params.value;
                }
            }

最终效果:

Esofar | 园豆:154 (初学一级) | 2016-08-03 14:10

@gao-yang: 客气了,其实都是你自己努力的成果!

刘宏玺 | 园豆:14004 (专家六级) | 2016-08-03 14:12

@刘宏玺: 分不多,还请收下哈,前辈。

Esofar | 园豆:154 (初学一级) | 2016-08-03 14:13
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册