Echarts扩展之ajax异步加载tooltip数据

最近做大数据可视化视图展现，随着业务的加深，正常的简单的echars里面的实例已经满足不了现有的需求；所以就需要对echarts进行更深一步的了解；

因为接触echars比较早，所以现在使用的是echarts的2.*版本；最新的echarts3添加了非常多的人性化的设计；非常好，但是还没来得及深入研究；

废话不多说；直角系视图包括折线图、柱状图 加载完页面之后点击数据的点会弹出相应的数据信息；在tooltip中设置可以实现基本的展现；

现在遇到的问题是需要判断当前周数，并且在tooltip中显示对应的周的起止时间；之前尝试过通过前台js函数来实现这一操作；但是最后发现这个耗时耗力，网上实例良莠不齐；最后还不如自己写，但是自己又不想写。

最后只能使用异步加载数据库的方式来实现这一需求；（数据库中存有日期和对应的周数的字段，查询周数可以得到对应的日期的集合0.0）

上代码：

option里面tooltip的设置：$("#custom_input")是一个隐藏的input；

 tooltip : {                         trigger: 'axis',                    formatter:function(params,ticket,callback){                 var data_week = params[0][1];                 getdata_range(data_week);                     setTimeout(function (){                             // 仅为了模拟异步回调                             callback(ticket, '第'+data_week+'周 ' +$("#custom_input").val()+'<br/>'+params[0][0]+':'+params[0].data);                         }, 800)                 return "Loading";                 }                     },

getdata_range方法：

function getdata_range(week){                if(typeof(week)=="string"){              var ss=  $.ajax({               type:"get",               url:"getdata_range_custom",               data:{week:week},               success:function(data){               console.log("返回的日期区间是"+data);               $("#custom_input").val(data);               return data;               },                });                }              return ss;                }

后台代码就不粘了 太繁琐；就是简单的查询数据返回结果的过程。

大体的逻辑就是：当用户点击对应的数据点的时候出发异步加载函数；返回值传给dom对象的input ；然后在调用function的回调函数获取input的value值。实现异步加载；

遇到的问题：

在使用function(params,trick,callback)方法之前；因为自定义过yAxis的显示数值，以为tooltip中的格式化数据也是相同的，所以走了很大的弯路，最后查询api才知道这个异步加载的方法；

第二个问题就是：当点击数据点的时候会触发两次事件（echarts内部的，不清楚为啥），一个是正常的week值，另一次是undefined；所以会请求两次数据库；浪费资源，存在不安全隐患。处理方法是if(typeof(week)=="string")  判断一下传入数据的类型。