var data = [ [ "area" , "click" , "color"], [ "广东省" , 111 , "#3871BF"], [ "浙江省" , 100 , "#3871BF"], [ "湖南省" , 80 , "#5182C7"], [ "湖北省" , 9 , "#5182C7"], [ "山西省" , 1 , "#6B95CF"], [ "山东省" , 33 , "#6B95CF"], [ "上海" , 1000 , "#88AAD9"], [ "江苏省" , 200 , "#88AAD9"], [ "福建省" , 300 , "#A6BFE2"], [ "江西省" , 500 , "#BBCFED"] ]; //测试 可以 试试 点击广东,就reset这个数据 var data_guandong = [ [ "area" , "click" , "color" ], [ "东莞" , 101 , "red" ], [ "深圳" , 88 , "#faab56"], [ "广州" , 88 , "#e75b59"] ] var options = { mapName : "china", //默认便是中国地图 areaField : "area", //可选,默认为第一个字段 area : { /* * @params arg 至少包含一个area属性 * 如果该area在data中。那么还会包含有data , dataIndex 连个属性 * 其中 data为一个{ area : "湖南省" , click:80 , color : "#5182C7" } 对象 * dataIndex 就是 改dataitem 在 整个data中的索引,比如湖南,dataIndex==2 */ fillStyle : function( arg ){ var c; if( arg.data ){ c = arg.data.color; } return c; }, linkage : true //开启地图联动功能,目前只支持省市联动 }, tips : { field : ["click"],//可选,默认为除开areaField外的所有字段 prefix : ["点击量"] } }; Chartx.map("canvasTest" , data , options).then(function(map){ map.on("areaClick" , function( e ){ //TODO: 要实现联动,需要开发者,在这里手动重置map var obj = {}; if( map.mapName == "广东" ){ obj.data = data_guandong }; if( map.mapName == "china" ){ obj.data = data }; map.reset( obj ); }); });
中国地图- 省市地图联动
联系人:@释剑