一般情況下帶效果的散點(diǎn)會用在有排名的數(shù)據(jù)，所以需要從后臺拿到需要的排名數(shù)據(jù)或者將數(shù)據(jù)處理成排序后的數(shù)據(jù)

series: [
         {
           name:"銷售額",
           type: "scatter",//散點(diǎn)圖
           coordinateSystem: "bmap",//坐標(biāo)系必須為bmap
           data: testPoint, //測試的城市數(shù)據(jù)
           tooltip: {//鼠標(biāo)移上去的提示
             formatter: function(params, ticket, callback) {
               
             }
           },
           //定制點(diǎn)的大小 根據(jù)銷售額的數(shù)據(jù)定制點(diǎn)的大小
           symbolSize: function(val) {
             //val是 value: [118.78, 32.04, 300]
             return val[2] / 10;
           },
           label: {
             formatter:(data)=>{//展示名稱和銷售額
               return data.name+"-"+data.data.value[2]
             },
             position: "right"
           },
           //點(diǎn)的顏色
           itemStyle: {
             color: "#ddb926"
           },
           //鼠標(biāo)移上去顯示文本
           emphasis: {
             label: {
               show: true
             }
           }
         },
         {
           //有效果的散點(diǎn)圖
           name:"Top10",
           type:"effectScatter",//有效果散點(diǎn)圖
           coordinateSystem: "bmap",//坐標(biāo)系必須為bmap
           data:topdata,
           //定制點(diǎn)的大小 根據(jù)銷售額的數(shù)據(jù)定制點(diǎn)的大小
           symbolSize: function(val) {
             //val是 value: [118.78, 32.04, 300]
             return val[2] / 10;
           },
         }
       ]

soogif.gif

繼續(xù)定制

{
           //有效果的散點(diǎn)圖
           name:"Top10",
           type:"effectScatter",//有效果散點(diǎn)圖
           coordinateSystem: "bmap",//坐標(biāo)系必須為bmap
           data:topdata,
           //定制點(diǎn)的大小 根據(jù)銷售額的數(shù)據(jù)定制點(diǎn)的大小
           symbolSize: function(val) {
             //val是 value: [118.78, 32.04, 300]
             return val[2] / 10;
           },
           tooltip:{

           },
           label: {
             formatter:(data)=>{//展示名稱和銷售額
               return data.name+"-"+data.data.value[2]
             },
             position: "right",
             show:true
           },
           hoverAnimation:true,//鼠標(biāo)移上去動畫
           rippleEffect:{
               brushType:'stroke',//設(shè)置波紋樣式
               // color:"red"
           },
           itemStyle:{//設(shè)置點(diǎn)的樣式
               color:"purple",
               shadowBlur:10,
               shadowColor:"#333"
           }
         }

接著傳入真實(shí)數(shù)據(jù)即可