{"id":3740,"date":"2019-12-24T17:51:30","date_gmt":"2019-12-24T09:51:30","guid":{"rendered":"http:\/\/gaigaiming.com\/?p=3740"},"modified":"2019-12-24T17:51:30","modified_gmt":"2019-12-24T09:51:30","slug":"%e5%a4%a7%e5%b1%8f%e8%ae%be%e8%ae%a1%e4%b8%adechart-%e5%9c%b0%e5%9b%be%e6%9f%b1%e7%8a%b6%e5%9b%be-%e9%a5%bc%e7%8a%b6%e5%9b%be%e5%bc%80%e5%8f%91%e9%97%ae%e9%a2%98%e6%95%b4%e7%90%86","status":"publish","type":"post","link":"https:\/\/www.gaigaiming.com\/index.php\/2019\/12\/24\/%e5%a4%a7%e5%b1%8f%e8%ae%be%e8%ae%a1%e4%b8%adechart-%e5%9c%b0%e5%9b%be%e6%9f%b1%e7%8a%b6%e5%9b%be-%e9%a5%bc%e7%8a%b6%e5%9b%be%e5%bc%80%e5%8f%91%e9%97%ae%e9%a2%98%e6%95%b4%e7%90%86\/","title":{"rendered":"\u5927\u5c4f\u8bbe\u8ba1\u4e2dechart \u5404\u79cd\u56fe\u5f62\u5143\u7d20\u8bb0\u5f55"},"content":{"rendered":"\n

 <\/p>\n\n\n\n

\u6ce8\uff1a\u5982\u679c\u9700\u8981\u767e\u5ea6\u5730\u56fe\uff0c\u9700\u8981\u767e\u5ea6\u8d26\u53f7\u751f\u6210apikey\u8c03\u7528\u767e\u5ea6\u5730\u56fe\u94fe\u63a5\u00a0<\/p>\n\n\n\n

\u4e0b\u9762\u5217\u51fa\u7684\u662f\u5229\u7528echart\u5f00\u53d1\u6570\u636e\u5927\u5c4f\u548c\u7ba1\u7406\u9a7e\u9a76\u8231\u6240\u9047\u5230\u7684\u548c\u503c\u5f97\u8bb0\u5f55\u4e0b\u6765\u7684\u70b9\u3002\u5305\u542b\u98de\u884c\u8fd0\u52a8\u8f68\u8ff9\uff0cGPS\u767e\u5ea6\u5730\u56fe\u548c\u67f1\u72b6\u56fe\u8fb9\u8ddd\uff0c\u6587\u672c\u503e\u659c\u663e\u793a\uff0c\u997c\u72b6\u56fe\uff0c\u5f02\u578b\u56fe\uff0c\u4e16\u754c\u5730\u56fe\uff0c\u4e2d\u56fd\u5730\u56fe\u4e0b\u94bb\u5730\u56fe\uff0c\u6298\u7ebf\u56fe\uff0c\u96f7\u8fbe\u56fe\uff0c\u4e91\u6807\u7b7e\u56fe\uff0c\u81ea\u52a8\u8f6e\u64ad\u6548\u679c\u7b49\u7b49<\/p>\n\n\n\n

0.Echart \u6570\u636e<\/p>\n\n\n\n

X\u8f74\u6807\u9898\u503e\u659c<\/p>\n\n\n\n

axisLabel:{<\/p>\n\n\n\n

Rotate:60 \/\/\u503e\u659c\u89d2\u5ea6<\/p>\n\n\n\n

}<\/p>\n\n\n\n

1\u3001\u67f1\u72b6\u4f53\u521a\u5f00\u59cb\u7684\u8ddd\u79bb<\/p>\n\n\n\n

xAxis: [{<\/p>\n\n\n\n

\u00a0 \u00a0 \/\/ boundaryGap: false,<\/p>\n\n\n\n

2\u3001\u6a2a\u5411\u67f1\u72b6\u56fe\u548c\u7eb5\u5411\u67f1\u72b6\u56fe\u7684\u533a\u522b\uff0c\u5728\u4e8e \u7eb5\u5411\u6811\u72b6\u56fe<\/p>\n\n\n\n

yAxis\uff1a\u3010type: \u2018value\u2019,\u3011<\/p>\n\n\n\n

xAxis\uff1a\u3010type: ‘category’,\u3011\u00a0<\/p>\n\n\n\n

3\u3001\u7ed9X\u8f74Y\u8f74\uff0c\u52a0\u5355\u4f4d<\/p>\n\n\n\n

echarts<\/strong>\u67f1\u72b6\u56fe\u7684X<\/strong>\u8f74Y<\/strong>\u8f74\u52a0\u5355\u4f4d\u7684\u5199\u6cd5<\/p>\n\n\n\n

yAxis : <\/strong>[<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 {<\/strong><\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 type : ‘value’<\/strong>,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 axisLabel:{formatter:'{value} %’}<\/strong><\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/strong><\/p>\n\n\n\n

],<\/p>\n\n\n\n

\u5982\u679c\u60f3\u63a7\u5236\u767e\u5206\u6bd4\u6700\u5927\u5230100% \u53ef\u6dfb\u52a0<\/p>\n\n\n\n

yAxis : [<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 type : ‘value’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 max:100,\/\/Y\u8f74\u6700\u5927\u503c \u4e0d\u5199\u7684\u8bdd\u81ea\u52a8\u8c03\u8282<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 axisLabel:{formatter:'{value} %’}<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 ],<\/p>\n\n\n\n

> max:100,\/\/Y\u8f74\u6700\u5927\u503c \u4e0d\u5199\u7684\u8bdd\u81ea\u52a8<\/p>\n\n\n\n

4\u3001\u4fee\u6539legend\u5b57\u4f53\u989c\u8272<\/p>\n\n\n\n

\u4fee\u6539legend\u5b57\u4f53\u989c\u8272\uff1a<\/p>\n\n\n\n

\u00a0legend: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 y:’55%’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 textStyle:{<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontSize: 18,\/\/\u5b57\u4f53\u5927\u5c0f<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 color: ‘#ffffff’\/\/\u5b57\u4f53\u989c\u8272<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 data: []<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u4fee\u6539x\u8f74\u5b57\u4f53\u989c\u8272\uff1a<\/p>\n\n\n\n

xAxis : [<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 type : ‘category’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 data : [],<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 axisLabel: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 show: true,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 textStyle: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 color: ‘#ffffff’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 ]<\/p>\n\n\n\n

\u4fee\u6539y\u8f74\u5b57\u4f53\u989c\u8272\uff1a<\/p>\n\n\n\n

yAxis : [<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 type : ‘value’,<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 name : ”,<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 axisLabel : {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 textStyle: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 color: ‘#ffffff’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 ]<\/p>\n\n\n\n

5\u3001echart\u8bbe\u7f6e\u67f1\u5b50\u4e4b\u95f4\u7684\u5bbd\u5ea6\uff0c\u548c\u67f1\u5b50\u672c\u8eab\u7684\u5bbd\u5ea6<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 series :\u00a0<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 name:”,<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 type:’bar’,<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 barWidth:20,<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 barGap:’80%’,\/*\u591a\u4e2a\u5e76\u6392\u67f1\u5b50\u8bbe\u7f6e\u67f1\u5b50\u4e4b\u95f4\u7684\u95f4\u8ddd*\/<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 barCategoryGap:’50%’,\/*\u591a\u4e2a\u5e76\u6392\u67f1\u5b50\u8bbe\u7f6e\u67f1\u5b50\u4e4b\u95f4\u7684\u95f4\u8ddd*\/<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 data:[],<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 itemStyle: {<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 normal: {<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 barBorderRadius: false,<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 color: ‘#1E9FFF’,<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

6\u3001\u9f20\u6807\u70b9\u51fb\u51fa\u73b0\u5706\u70b9\u653e\u5927<\/p>\n\n\n\n

7\u3001\u67f1\u4f53\u4e0a\u6709\u6570\u636e<\/p>\n\n\n\n

var labelOption = {<\/p>\n\n\n\n

\u00a0 \u00a0 normal: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 show: true,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 position: ‘top’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 align: ‘center’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 formatter: ‘{c}’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 fontSize: ‘100%’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 rich: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \/\/ name: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \/\/ textBorderColor: ‘#fff’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \/\/ }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 }<\/p>\n\n\n\n

};<\/p>\n\n\n\n

orientation: portrait;\/<\/p>\n\n\n\n

\u5f3a\u5236\u7ad6\u5c4f<\/p>\n\n\n\n

\n
http:\/\/localhost:8080\/cabin_portal_war_exploded\/a\/module\/exclusive\/showJspfl?dateStamp=201908&busType=%E5%85%A8%E9%99%A9%E7%B1%BB<\/div>\n<\/figure>\n\n\n\n

\u5982\u4f55\u591a\u4e2a\u6570\u636e\u8fdb\u884c\uff0cffarmat\u6392\u5e8f\u8fdb\u884c<\/p>\n\n\n\n

\/\/\u6570\u636e\u8fdb\u884cpush\u51fa\u6765\u6574\u4e2a<\/p>\n\n\n\n

success: function (result) {<\/p>\n\n\n\n

\u00a0 \u00a0 $<\/em><\/strong>.each(result, function (index, item) {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 qddat1.push(item.channelName);<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 qddat2.push(item.premiumBudget);<\/p>\n\n\n\n

\/\/ \u62fc\u63a5\u51fa\u65b0\u7684\u6570\u636e\uff0c\u8fdb\u884c\u79fb\u9664\u9690\u85cf\u95ee\u9898<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 qddat3.push<\/strong>({<\/strong><\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 “name”:item.channelName<\/strong>,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 “value”:item.premiumY<\/strong>,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 “premiumYRate”:item.premiumYRate<\/strong>,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 “premiumBudgetComplete”:item.premiumBudgetComplete<\/strong><\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/strong>);<\/p>\n\n\n\n

\u00a0 \u00a0 });<\/p>\n\n\n\n

\u00a0 \u00a0 var qddat4 = [];<\/p>\n\n\n\n

\u00a0 \u00a0 var qddat5 = [];<\/p>\n\n\n\n

\u00a0 \u00a0 var qddat6 = [], qdata7 = [], qdata8 = [];<\/p>\n\n\n\n

\u00a0 \u00a0 for (var i = qddat1.length – 1; i >= 0; i–) {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 qddat4.push(qddat1[i]);<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 qddat5.push(qddat2[i]);<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 qddat6.push(qddat3[i]);<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \/* qdata7.push(qtbzf[i]);<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 qdata8.push(qysdc[i]);*\/<\/p>\n\n\n\n

\u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 chart2(qddat4, qddat5, qddat6, qdata7, qdata8);<\/p>\n\n\n\n

},<\/p>\n\n\n\n

formatter: function (params) {<\/p>\n\n\n\n

\u00a0 \u00a0 var htmlStr = “”;<\/p>\n\n\n\n

\u00a0 \u00a0 for (var i = 0; i < params.length; i++) {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 if (params[i].seriesName == ‘\u5b9e\u9645’ ) {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 htmlStr += “\u540c\u6bd4\u589e\u5e45” + “:” + params[i].data.premiumYRate + “%” + “<\/br>”;<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 htmlStr += “\u9884\u7b97\u8fbe\u6210” + “:” + params[i].data.premiumBudgetComplete + “%” + “<\/br>”;<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 console<\/em><\/strong>.log(htmlStr);<\/p>\n\n\n\n

\u00a0 \u00a0 return htmlStr;<\/p>\n\n\n\n

}<\/p>\n\n\n\n

8\u3001\u8bbe\u7f6e\u7f51\u683c\u80cc\u666f x\u8f74\u548cy\u8f74\u5185<\/p>\n\n\n\n

splitLine: {<\/p>\n\n\n\n

show: true,<\/p>\n\n\n\n

lineStyle: {<\/p>\n\n\n\n

color: ‘#1e2c41’, \/\/\u00a0\u7f51\u683c\u989c\u8272<\/p>\n\n\n\n

width: 1, \/\/\u7f51\u683c\u7ebf\u5bbd<\/p>\n\n\n\n

type: ‘solid’, \/\/\u7f51\u683cborderstyle<\/p>\n\n\n\n

shadowColor: ‘rgba(255, 255, 255, 0.5)’,<\/p>\n\n\n\n

shadowBlur: 10,<\/p>\n\n\n\n

shadowOffsetX:2,<\/p>\n\n\n\n

shadowOffsetY:1<\/p>\n\n\n\n

},<\/p>\n\n\n\n

},<\/p>\n\n\n\n

9.echart \u8bbe\u7f6eyAxis.min y<\/strong>\u8f74\u7684\u6570\u636e<\/p>\n\n\n\n

min: function<\/strong>(value<\/strong>) {<\/strong><\/p>\n\n\n\n

return value.min – 100<\/strong>;<\/p>\n\n\n\n

}<\/strong>,<\/p>\n\n\n\n

max: function<\/strong>(value<\/strong>) {<\/strong><\/p>\n\n\n\n

\u00a0 \u00a0 return parseInt<\/strong>(value.max +100<\/strong>);<\/p>\n\n\n\n

}<\/strong><\/p>\n\n\n\n

10<\/strong>\u3001\u53bb\u9664\u6307\u793a\u7ebf<\/p>\n\n\n\n

echarts<\/strong>\u4e2d\u5982\u4f55\u53bb\u9664\uff08\u4fee\u6539\uff09\u6307\u793a\u7ebf<\/p>\n\n\n\n

tooltip:{<\/p>\n\n\n\n

axisPointer :{<\/p>\n\n\n\n

type: (‘line’ | ‘cross’ | ‘shadow’ | ‘none'(\u65e0)) ,<\/p>\n\n\n\n

lineStyle ->color: (\u586b\u989c\u8272\u503c) ,<\/p>\n\n\n\n

type: (‘solid’ | ‘dotted’ | ‘dashed’\uff0c \u6811\u56fe\u8fd8\u53ef\u4ee5\u9009\uff1a’curve’ | ‘broken’) ,<\/p>\n\n\n\n

width: (\u6307\u793a\u7ebf\u5bbd) ,<\/p>\n\n\n\n

shadowColor : (\u6307\u793a\u7ebf\u9634\u5f71\u989c\u8272) ,<\/p>\n\n\n\n

shadowBlur: (\u5927\u7ea60\u7684\u6570) ,<\/p>\n\n\n\n

shadowOffsetX : (\u6a2a\u5411\u504f\u79fb\u6b63\u53f3\u8d1f\u5de6) ,<\/p>\n\n\n\n

shadowOffsetY : (\u7eb5\u5411\u504f\u79fb\u6b63\u4e0a\u8d1f\u4e0b)<\/p>\n\n\n\n

}<\/p>\n\n\n\n

}<\/p>\n\n\n\n

11\u3001x\u8f74y\u8f74\u989c\u8272<\/p>\n\n\n\n

xAxis: [{<\/p>\n\n\n\n

type: ‘category’,<\/p>\n\n\n\n

axisLine: { \/\/x<\/strong>\u8f74\u989c\u8272<\/p>\n\n\n\n

lineStyle: {<\/strong><\/p>\n\n\n\n

color: ‘#1e2c41’<\/strong><\/p>\n\n\n\n

}<\/strong><\/p>\n\n\n\n

}<\/strong>,<\/p>\n\n\n\n

splitLine: { \/\/\u7f51\u683c\u989c\u8272<\/p>\n\n\n\n

interval: 0,<\/p>\n\n\n\n

show: true,<\/p>\n\n\n\n

lineStyle: {<\/p>\n\n\n\n

color: ‘#1e2c41’,<\/p>\n\n\n\n

width: 1,<\/p>\n\n\n\n

type: ‘solid’,<\/p>\n\n\n\n

shadowColor: ‘rgba(255, 255, 255, 0.5)’,<\/p>\n\n\n\n

},<\/p>\n\n\n\n

},<\/p>\n\n\n\n

boundaryGap: 10,<\/p>\n\n\n\n

data: dataX<\/p>\n\n\n\n

\/\/ data: [‘2015’, ‘2016’, ‘2017’, ‘2018’, ‘2019’]<\/p>\n\n\n\n

}],<\/p>\n\n\n\n

12\u3001tip\u603b\u662f\u663e\u793a<\/p>\n\n\n\n

13\u6269\u5c55\u6548\u679c<\/p>\n\n\n\n

\u5708\u5c42\u989c\u8272\u4fee\u6539<\/p>\n\n\n\n

color:’blue’,<\/p>\n\n\n\n

series: [{<\/p>\n\n\n\n

type: ‘effectScatter’,<\/p>\n\n\n\n

coordinateSystem: ‘geo’,<\/p>\n\n\n\n

zlevel: 2,<\/p>\n\n\n\n

rippleEffect: { \/\/\u6d9f\u6f2a\u7279\u6548<\/p>\n\n\n\n

color:’white’,<\/p>\n\n\n\n

period: 4, \/\/\u52a8\u753b\u65f6\u95f4\uff0c\u503c\u8d8a\u5c0f\u901f\u5ea6\u8d8a\u5feb<\/p>\n\n\n\n

brushType: ‘stroke’, \/\/\u6ce2\u7eb9\u7ed8\u5236\u65b9\u5f0f stroke, fill<\/p>\n\n\n\n

scale: 20, \/\/\u6ce2\u7eb9\u5706\u73af\u6700\u5927\u9650\u5236\uff0c\u503c\u8d8a\u5927\u6ce2\u7eb9\u8d8a\u5927<\/p>\n\n\n\n

},<\/p>\n\n\n\n

label: {<\/p>\n\n\n\n

normal: {<\/p>\n\n\n\n

show: true,<\/p>\n\n\n\n

position: ‘right’, \/\/\u663e\u793a\u4f4d\u7f6e<\/p>\n\n\n\n

offset: [5, 0], \/\/\u504f\u79fb\u8bbe\u7f6e<\/p>\n\n\n\n

formatter: function(params) { \/\/\u5706\u73af\u663e\u793a\u6587\u5b57<\/p>\n\n\n\n

return params.data.name;<\/p>\n\n\n\n

},<\/p>\n\n\n\n

fontSize: 13,<\/p>\n\n\n\n

},<\/p>\n\n\n\n

emphasis: {<\/p>\n\n\n\n

show: false<\/p>\n\n\n\n

}<\/p>\n\n\n\n

},<\/p>\n\n\n\n

\/\/ symbol: ‘circle’,<\/p>\n\n\n\n

showSymbol: false,<\/p>\n\n\n\n

hoverAnimation: true,<\/p>\n\n\n\n

itemStyle: {<\/p>\n\n\n\n

normal: {<\/p>\n\n\n\n

color: ‘#ec8000’, \/\/\u8bbe\u7f6e\u56fe\u4f8b\u989c\u8272cricle\u8fb9\u6846<\/p>\n\n\n\n

borderWidth: 2,<\/p>\n\n\n\n

show: false,<\/p>\n\n\n\n

}<\/p>\n\n\n\n

},<\/p>\n\n\n\n

\/\/ symbol: ‘circle’, \/\/\u6298\u70b9\u8bbe\u5b9a\u4e3a\u5b9e\u5fc3\u70b9<\/p>\n\n\n\n

symbolSize: function(val) {<\/p>\n\n\n\n

return 8; \/\/\u5706\u73af\u5927\u5c0f<\/p>\n\n\n\n

},<\/p>\n\n\n\n

data: res11<\/p>\n\n\n\n

},<\/p>\n\n\n\n

14\u3001echart legend \u7528\u81ea\u5b9a\u4e49\u56fe\u7247<\/p>\n\n\n\n

\u5f53\u6298\u7ebf\u56fe\u65f6\uff0clegend\u9ed8\u8ba4\u65f6rect\u5f62\u5f0f\uff0c\u5982\u679c\u9700\u8981\u6539\u56fe\u4f8b\u5f62\u72b6\uff0c\u53ef\u4ee5\u81ea\u5df1\u8bbe\u7f6elegend\u7684icon\u5c5e\u6027<\/p>\n\n\n\n

legend: {<\/p>\n\n\n\n

\u00a0 \u00a0 icon:’stack’<\/p>\n\n\n\n

},<\/p>\n\n\n\n

15\u3001\u81ea\u5b9a\u4e49\u6bcf\u4e2a\u56fe\u4f8b\u6837\u5f0f\uff1a\u4e3adata\u7684\u6bcf\u4e2a\u5bf9\u8c61\u4fee\u6539icon\u5c5e\u6027<\/p>\n\n\n\n

legend:{<\/p>\n\n\n\n

\u00a0 \u00a0 show:true,<\/p>\n\n\n\n

\u00a0 \u00a0 orient:’horizontal’,<\/p>\n\n\n\n

\u00a0 \u00a0 borderColor:’#df3434′,<\/p>\n\n\n\n

\u00a0 \u00a0 borderWidth:2,<\/p>\n\n\n\n

\u00a0 \u00a0 data:[<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 name:’\u84b8\u53d1\u91cf’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 textStyle:{<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontSize:12,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontWeight:’bolder’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 color:’#cccccc’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 icon:’stack’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 name:’\u964d\u6c34\u91cf’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 textStyle:{<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontSize:12,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontWeight:’bolder’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 color:’#df3434′<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 icon:’pie’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 ]<\/p>\n\n\n\n

}<\/p>\n\n\n\n

2\u3001\u4fee\u6539\u56fe\u4f8b\u7684\u56fe\u6807\u4e3a\u81ea\u5b9a\u4e49\u56fe\u7247<\/p>\n\n\n\n

\u3000\u3000\u9996\u5148\u6211\u627e\u4e86\u5982\u4e0b\u4e24\u5f20\u56fe\u7247\u653e\u5728\u6839\u76ee\u5f55\u4e0b\u7684images\u6587\u4ef6\u5939\u4e0b<\/p>\n\n\n\n

legend:{<\/p>\n\n\n\n

\u00a0 \u00a0 show:true,<\/p>\n\n\n\n

\u00a0 \u00a0 orient:’horizontal’,<\/p>\n\n\n\n

\u00a0 \u00a0 borderColor:’#df3434′,<\/p>\n\n\n\n

\u00a0 \u00a0 borderWidth:2,<\/p>\n\n\n\n

\u00a0 \u00a0 data:[<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 name:’\u84b8\u53d1\u91cf’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 textStyle:{<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontSize:12,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontWeight:’bolder’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 color:’#cccccc’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 icon:’image:\/\/.\/images\/icon1.png’\/\/\u683c\u5f0f\u4e3a’image:\/\/+icon\u6587\u4ef6\u5730\u5740’\uff0c\u5176\u4e2dimage::\u540e\u7684\/\/\u4e0d\u80fd\u7701\u7565<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 name:’\u964d\u6c34\u91cf’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 textStyle:{<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontSize:12,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontWeight:’bolder’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 icon:’image:\/\/.\/images\/icon2.png’\/\/\u683c\u5f0f\u4e3a’image:\/\/+icon\u6587\u4ef6\u5730\u5740’\uff0c\u5176\u4e2dimage::\u540e\u7684\/\/\u4e0d\u80fd\u7701\u7565<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 icon:’pie’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 ]<\/p>\n\n\n\n

}<\/p>\n\n\n\n

legend:{<\/p>\n\n\n\n

itemWidth: 10 , \/\/\u8bbe\u7f6e\u56fe\u7247\u5bbd\u5ea6\u4e3a10<\/p>\n\n\n\n

itemHeight: 10 \/\/\u8bbe\u7f6e\u56fe\u7247\u9ad8\u5ea6\u4e3a10<\/p>\n\n\n\n

}<\/p>\n\n\n\n

15\u3001html\u9875\u9762\u5730\u56fe\u56fe\u5c42\uff0cdisplay\uff1anone; display:block<\/p>\n\n\n\n

type: ‘scatter’,<\/p>\n\n\n\n

coordinateSystem: ‘geo’, \u51fa\u73b0\u6570\u636e\u88ab\u9690\u85cf\u7684\u60c5\u51b5\u3002<\/p>\n\n\n\n

\u53ef\u4ee5\u628a\u5730\u56fe\u7684areaColor\u8bbe\u7f6e\u4e3a\u6709\u8272\u8fdb\u884c\u68c0\u67e5<\/p>\n\n\n\n

itemStyle: {<\/p>\n\n\n\n

normal: {<\/p>\n\n\n\n

areaColor: ‘none’,<\/p>\n\n\n\n

borderWidth: ‘0px’,<\/p>\n\n\n\n

borderColor: ‘none’<\/p>\n\n\n\n

},<\/p>\n\n\n\n

emphasis: {<\/p>\n\n\n\n

areaColor: ‘none’<\/p>\n\n\n\n

}<\/p>\n\n\n\n

}<\/p>\n\n\n\n

\u6570\u7ec4\u72b6\u7684\u5b57\u7b26\u4e32\uff0c\u8f6c\u6210\u5bf9\u8c61\u6570\u7ec4<\/p>\n\n\n\n

eval(“(“+data[i].carLine+”)”);<\/p>\n\n\n\n

Ajax\u51fa\u73b0\u8fdb\u5165\u5230error\uff0c\u89e3\u51b3\u65b9\u6848\u662f\u7a7a\u767d\u548cjson\u5bf9\u8c61\u7684\u5c5e\u6027\u503ckey\u503c\u662f\u6ca1\u6709\u53cc\u5f15\u53f7<\/p>\n\n\n\n

16\u3001\u997c\u72b6\u56fe \u6307\u5f15\u7ebf<\/p>\n\n\n\n

\u00a0 \u00a0 series : [<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 type: ‘pie’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 radius : ‘65%’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 center: [‘50%’, ‘50%’],<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 selectedMode: ‘single’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 data:[<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 {value:535, name: ‘\u8346\u5dde’},<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 {value:510, name: ‘\u5156\u5dde’},<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 {value:634, name: ‘\u76ca\u5dde’},<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 {value:735, name: ‘\u897f\u51c9’}<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 ],<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 itemStyle: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 emphasis: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 shadowBlur: 10,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 shadowOffsetX: 0,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 shadowColor: ‘rgba(0, 0, 0, 0.5)’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 label: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 normal: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 show:true,\/\/\u6807\u7b7e\u9690\u85cf<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \/\/ position: ‘center’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 emphasis: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 show: true,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 textStyle: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontSize: ’30’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 fontWeight: ‘bold’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 labelLine:{\/\/\u6307\u793a\u7ebf<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 show:true<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 ]<\/p>\n\n\n\n

17\u3001116.404, 39.915 \u767e\u5ea6\u5730\u56fe\u8bbe\u7f6e\u4e2d\u5fc3\u70b9\u4e0d\u8d77\u4f5c\u7528 echart<\/p>\n\n\n\n

\u00a0\u7f3a\u5c11 Cannot read property ‘0’ of undefined<\/p>\n\n\n\n

\u00a0 \u00a0 at e.getLineCoords (echarts-3.8.5.min.js:22)<\/p>\n\n\n\n

\u5730\u56fe\u7684\u4e2d\u5fc3\u70b9\u5728\u5de6\u4e0a\u89d2<\/p>\n\n\n\n

\u53ea\u8981\u5148\u53bbshow<\/p>\n\n\n\n

\u7136\u540e\u518d\u751f\u6210<\/p>\n\n\n\n

\u00a0Math.max.apply<\/p>\n\n\n\n

\u53d6\u51fa\u6570\u7ec4\u4e2d\u6700\u5927\u6570\u636e<\/p>\n\n\n\n

\u00a0Math.max.apply(null, [‘1′,’2′,’3.1′,’3.2’])<\/p>\n\n\n\n

< 3.2<\/p>\n\n\n\n

 <\/p>\n\n\n\n

17\u3001\u767e\u5ea6\u5730\u56fe\u548cechart\u7ed3\u5408\uff0c\u51fa\u73b0\u4e2a\u4e2a\u6027\u5730\u56fe\u8bbe\u7f6e<\/p>\n\n\n\n

\u5730\u56fe\u7248\u672c\u8981\u7528v3.0 \u6837\u5f0f<\/p>\n\n\n\n

var bmap = myChart.getModel().getComponent(‘bmap’).getBMap();<\/p>\n\n\n\n

bmap.setMapStyleV2({<\/p>\n\n\n\n

styleId: ‘7479f0ec695598ad21b6ddfb3367d34f’<\/p>\n\n\n\n

});<\/p>\n\n\n\n

map.setViewport(pointsView)<\/p>\n\n\n\n

var points = [point1, point2,point3];<\/p>\n\n\n\n

var view = map.getViewport(eval(points));<\/p>\n\n\n\n

var mapZoom = view.zoom;\u00a0<\/p>\n\n\n\n

var centerPoint = view.center;\u00a0<\/p>\n\n\n\n

map.centerAndZoom(centerPoint,mapZoom);<\/p>\n\n\n\n

\/\/\u5f02\u578b\u56fe\u7684\u52a0\u8f7d\uff0c\u548c\u8fb9\u8ddd\u3002\u8fb9\u8dddbarCategoryGap\u548cbarWidth\u4e0d\u80fd\u540c\u65f6\u8bbe\u7f6e\uff0c\u4e14x\u8f74\u7684\u548c\u6570\u636e\u4e2a\u6570\u8981\u4e00\u81f4<\/p>\n\n\n\n

option = {<\/p>\n\n\n\n

\u00a0 \u00a0 xAxis: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 data: [‘a’, ‘b’, ‘c’, ‘d’,’3′,’3′,’3′,’9′,’9′],<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 axisTick: {show: false},<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 axisLabel: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 formatter: ‘barGap: \\’-100%\\”<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 yAxis: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 splitLine: {show: false}<\/p>\n\n\n\n

\u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 animationDurationUpdate: 1200,<\/p>\n\n\n\n

\u00a0 \u00a0 series: [{<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 type: ‘bar’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 itemStyle: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 normal: {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 color: ‘#ddd’<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 silent: true,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \/\/ barWidth: 40,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 barGap: ‘-100%’, \/\/ Make series be overlap<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 data: [60, 60, 60, 60, 60, 60, 60, 60],<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 barCategoryGap:’20%’<\/p>\n\n\n\n

\u00a0 \u00a0 }, {<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 type: ‘bar’,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 \/\/ barWidth: 40<\/strong>,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 z: 10,<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 data: [45, 60, 13, 25, 60, 60, 60, 60],<\/p>\n\n\n\n

\u00a0 \u00a0 \u00a0 \u00a0 barCategoryGap:’20%’<\/strong><\/p>\n\n\n\n

\u00a0 \u00a0 }]<\/p>\n\n\n\n

};<\/p>\n\n\n\n

var barGaps = [‘30%’, ‘-100%’];<\/p>\n\n\n\n

var loopIndex = 0;<\/p>\n\n\n\n

\/\/ setInterval(function () {<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 var barGap = barGaps[loopIndex];<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 myChart.setOption({<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 \u00a0 \u00a0 xAxis: {<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 axisLabel: {<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 formatter: ‘barGap: \\” + barGap + ‘\\”<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 }<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 \u00a0 \u00a0 },<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 \u00a0 \u00a0 series: [{<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 barGap: barGap<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 \u00a0 \u00a0 }]<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 });<\/p>\n\n\n\n

\/\/ \u00a0 \u00a0 loopIndex = (loopIndex + 1) % barGaps.length;<\/p>\n\n\n\n

\/\/ }, 2000);<\/p>\n\n\n\n

18\u3001\u591a\u4e2a\u8bbe\u7f6e\u8f6e\u64ad\u56fe \u540e\u53f0\u63a7\u5236tooltip\u7684\u65f6\u5019\u4f1a\u51fa\u73b0\uff0c\u591a\u4e2atooltip\u76f4\u63a5\u5220\u9664div\u5373\u53ef\uff08\u5229\u7528\u6253\u5370\u6765\u8c03\u8bd5\u7a0b\u5e8f\uff09<\/p>\n\n\n\n

19.echart\u8fd0\u52a8\u7ebf\u8f68\u8ff9\u98de\u884c\u56fe 3.2.2\u7248\u672c\u4ee5\u4e0a<\/p>\n\n\n\n

function convertDataLines(data) {<\/p>\n\n\n\n

var res = [];<\/p>\n\n\n\n

var toCoord = [‘111.461338’, ‘40.752298’];<\/p>\n\n\n\n

for (var i = 0; i < data.length; i++) {<\/p>\n\n\n\n

var dataItem = data[i];<\/p>\n\n\n\n

res.push(<\/p>\n\n\n\n

{<\/p>\n\n\n\n

coords: [<\/p>\n\n\n\n

\u00a0 \u00a0 dataItem.value,\u00a0 \/\/ \u8d77\u70b9<\/p>\n\n\n\n

\u00a0 \u00a0 toCoord \u00a0 \/\/ \u7ec8\u70b9<\/p>\n\n\n\n

]<\/p>\n\n\n\n

}<\/p>\n\n\n\n

);<\/p>\n\n\n\n

}<\/p>\n\n\n\n

return res;<\/p>\n\n\n\n

};<\/p>\n","protected":false},"excerpt":{"rendered":"

  \u6ce8\uff1a\u5982\u679c\u9700\u8981\u767e\u5ea6\u5730\u56fe\uff0c\u9700\u8981\u767e\u5ea6\u8d26\u53f7\u751f\u6210apikey\u8c03\u7528\u767e\u5ea6\u5730\u56fe\u94fe\u63a5\u00a0 \u4e0b\u9762\u5217\u51fa\u7684\u662f\u5229\u7528echar […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-3740","post","type-post","status-publish","format-standard","hentry","category-4"],"_links":{"self":[{"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/posts\/3740","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/comments?post=3740"}],"version-history":[{"count":0,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/posts\/3740\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/media?parent=3740"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/categories?post=3740"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/tags?post=3740"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}