inMap基于 Canvas 的大数据可视化库

联合创作 · 2023-09-23 07:58

inMap 是 TalkingData 可视化团队开源的一款基于 canvas 的大数据可视化库,专注于大数据方向点、线、面的可视化效果展示。目前支持散点、围栏、热力、网格、聚合等方式;致力于让大数据可视化变得简单易用。

特性

  • 高性能

  • 多线程

  • 多图层叠加

  • 友好的 API

  • 可以自定义主题

安装

使用 npm

$ npm install inmap --save

或使用 <script> 全局引用

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=0lPULNZ5PmrFVg76kFuRjezF"></script>
<script type="text/javascript" src="//unpkg.com/inmap/dist/inmap.min.js"></script>

inMap依赖百度地图,需要开发者到百度地图开发平台申请,方可使用百度地图。

示例代码

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body,
        html {
            width: 100%;
            height: 100%;
            margin: 0;
            font-family: "微软雅黑";
        }
        #allmap {
            width: 100%;
            height: 100%;
        }
        p {
            margin-left: 5px;
            font-size: 14px;
        }
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=U3q69k0Dv0GCYNiiZeHPf7BS"></script>
    <script src="http://inmap.iviewui.com/inmap/inmap.min.js"></script>
    <title></title>
</head>
<body>
    <div id="allmap"></div>
</body>
</html>
<script>
var data = [{"lng":"116.395645","lat":"39.929986","count":6},{"lng":"121.487899","lat":"31.249162","count":6},{"lng":"117.210813","lat":"39.14393","count":5},{"lng":"106.530635","lat":"29.544606","count":4},{"lng":"117.216005","lat":"31.859252","count":4},{"lng":"117.984943","lat":"26.050118","count":8},{"lng":"102.457625","lat":"38.103267","count":2},{"lng":"113.394818","lat":"23.408004","count":9},{"lng":"108.924274","lat":"23.552255","count":1},{"lng":"106.734996","lat":"26.902826","count":2},{"lng":"109.733755","lat":"19.180501","count":0},{"lng":"115.661434","lat":"38.61384","count":2},{"lng":"113.486804","lat":"34.157184","count":0},{"lng":"128.047414","lat":"47.356592","count":9},{"lng":"112.410562","lat":"31.209316","count":3},{"lng":"111.720664","lat":"27.695864","count":7},{"lng":"119.368489","lat":"33.013797","count":7},{"lng":"115.676082","lat":"27.757258","count":0},{"lng":"126.262876","lat":"43.678846","count":0},{"lng":"122.753592","lat":"41.6216","count":4},{"lng":"114.415868","lat":"43.468238","count":2},{"lng":"106.155481","lat":"37.321323","count":7},{"lng":"96.202544","lat":"35.499761","count":5},{"lng":"118.527663","lat":"36.09929","count":2},{"lng":"112.515496","lat":"37.866566","count":5},{"lng":"109.503789","lat":"35.860026","count":7},{"lng":"102.89916","lat":"30.367481","count":6},{"lng":"89.137982","lat":"31.367315","count":4},{"lng":"85.614899","lat":"42.127001","count":1},{"lng":"101.592952","lat":"24.864213","count":4},{"lng":"119.957202","lat":"29.159494","count":1},{"lng":"114.186124","lat":"22.293586","count":8},{"lng":"113.557519","lat":"22.204118","count":6},{"lng":"120.961454","lat":"23.80406","count":2},{"lng":"117.282699","lat":"31.866942","count":0},{"lng":"117.058739","lat":"30.537898","count":3},{"lng":"117.35708","lat":"32.929499","count":8},{"lng":"115.787928","lat":"33.871211","count":5},{"lng":"117.88049","lat":"31.608733","count":3},{"lng":"117.494477","lat":"30.660019","count":9},{"lng":"118.32457","lat":"32.317351","count":3},{"lng":"115.820932","lat":"32.901211","count":3},{"lng":"116.791447","lat":"33.960023","count":8},{"lng":"117.018639","lat":"32.642812","count":9},{"lng":"118.29357","lat":"29.734435","count":5},{"lng":"116.505253","lat":"31.755558","count":8},{"lng":"118.515882","lat":"31.688528","count":1},{"lng":"116.988692","lat":"33.636772","count":3},{"lng":"117.819429","lat":"30.94093","count":3},{"lng":"118.384108","lat":"31.36602","count":9},{"lng":"118.752096","lat":"30.951642","count":2},{"lng":"119.330221","lat":"26.047125","count":6},{"lng":"117.017997","lat":"25.078685","count":2},{"lng":"118.181883","lat":"26.643626","count":2},{"lng":"119.542082","lat":"26.656527","count":3},{"lng":"119.077731","lat":"25.44845","count":9},{"lng":"118.600362","lat":"24.901652","count":2},{"lng":"117.642194","lat":"26.270835","count":7},{"lng":"118.103886","lat":"24.489231","count":7},{"lng":"117.676205","lat":"24.517065","count":6},{"lng":"103.823305","lat":"36.064226","count":6},{"lng":"104.171241","lat":"36.546682","count":4},{"lng":"104.626638","lat":"35.586056","count":0},{"lng":"102.917442","lat":"34.992211","count":7},{"lng":"98.281635","lat":"39.802397","count":6},{"lng":"102.208126","lat":"38.516072","count":7},{"lng":"98.508415","lat":"39.741474","count":3},{"lng":"103.215249","lat":"35.598514","count":4},{"lng":"104.934573","lat":"33.39448","count":6},{"lng":"106.688911","lat":"35.55011","count":4},{"lng":"107.644227","lat":"35.726801","count":6},{"lng":"105.736932","lat":"34.584319","count":3},{"lng":"102.640147","lat":"37.933172","count":1},{"lng":"100.459892","lat":"38.93932","count":2},{"lng":"113.30765","lat":"23.120049","count":6},{"lng":"116.630076","lat":"23.661812","count":7},{"lng":"113.763434","lat":"23.043024","count":4},{"lng":"113.134026","lat":"23.035095","count":1},{"lng":"114.713721","lat":"23.757251","count":3},{"lng":"114.410658","lat":"23.11354","count":7},{"lng":"113.078125","lat":"22.575117","count":0},{"lng":"116.379501","lat":"23.547999","count":6},{"lng":"110.931245","lat":"21.668226","count":7},{"lng":"116.126403","lat":"24.304571","count":3},{"lng":"113.040773","lat":"23.698469","count":5},{"lng":"116.72865","lat":"23.383908","count":9},{"lng":"115.372924","lat":"22.778731","count":4},{"lng":"113.594461","lat":"24.80296","count":1},{"lng":"114.025974","lat":"22.546054","count":7},{"lng":"111.97701","lat":"21.871517","count":4},{"lng":"112.050946","lat":"22.937976","count":2},{"lng":"110.365067","lat":"21.257463","count":8},{"lng":"112.479653","lat":"23.078663","count":1},{"lng":"113.42206","lat":"22.545178","count":4},{"lng":"113.562447","lat":"22.256915","count":8},{"lng":"108.297234","lat":"22.806493","count":9},{"lng":"106.631821","lat":"23.901512","count":9},{"lng":"109.122628","lat":"21.472718","count":8},{"lng":"107.357322","lat":"22.415455","count":1},{"lng":"108.351791","lat":"21.617398","count":1},{"lng":"110.26092","lat":"25.262901","count":8},{"lng":"109.613708","lat":"23.103373","count":2},{"lng":"108.069948","lat":"24.699521","count":8},{"lng":"111.552594","lat":"24.411054","count":4},{"lng":"109.231817","lat":"23.741166","count":3},{"lng":"109.422402","lat":"24.329053","count":2},{"lng":"108.638798","lat":"21.97335","count":7},{"lng":"111.305472","lat":"23.485395","count":7},{"lng":"110.151676","lat":"22.643974","count":5},{"lng":"106.709177","lat":"26.629907","count":7},{"lng":"105.92827","lat":"26.228595","count":5},{"lng":"105.300492","lat":"27.302612","count":8},{"lng":"104.852087","lat":"26.591866","count":8},{"lng":"109.196161","lat":"27.726271","count":9},{"lng":"106.93126","lat":"27.699961","count":8},{"lng":"104.900558","lat":"25.095148","count":3},{"lng":"107.985353","lat":"26.583992","count":2},{"lng":"107.523205","lat":"26.264536","count":5},{"lng":"110.330802","lat":"20.022071","count":2},{"lng":"109.358586","lat":"19.216056","count":0},{"lng":"109.656113","lat":"18.597592","count":2},{"lng":"109.0113","lat":"19.222483","count":1},{"lng":"109.413973","lat":"19.571153","count":5},{"lng":"109.996736","lat":"19.693135","count":6},{"lng":"108.85101","lat":"18.998161","count":7},{"lng":"110.32009","lat":"19.490991","count":9},{"lng":"110.414359","lat":"19.21483","count":6},{"lng":"109.861849","lat":"19.039771","count":1},{"lng":"109.062698","lat":"18.658614","count":0},{"lng":"109.724101","lat":"19.805922","count":1},{"lng":"109.948661","lat":"18.575985","count":3},{"lng":"109.522771","lat":"18.257776","count":8},{"lng":"110.063364","lat":"19.347749","count":2},{"lng":"110.292505","lat":"18.839886","count":8},{"lng":"110.780909","lat":"19.750947","count":4},{"lng":"109.51775","lat":"18.831306","count":5},{"lng":"114.522082","lat":"38.048958","count":7},{"lng":"115.49481","lat":"38.886565","count":4},{"lng":"116.863806","lat":"38.297615","count":7},{"lng":"117.933822","lat":"40.992521","count":4},{"lng":"114.482694","lat":"36.609308","count":5},{"lng":"115.686229","lat":"37.746929","count":8},{"lng":"116.703602","lat":"39.518611","count":7},{"lng":"119.604368","lat":"39.945462","count":2},{"lng":"118.183451","lat":"39.650531","count":3},{"lng":"114.520487","lat":"37.069531","count":3},{"lng":"114.893782","lat":"40.811188","count":9},{"lng":"113.649644","lat":"34.75661","count":1},{"lng":"114.351807","lat":"36.110267","count":1},{"lng":"114.29777","lat":"35.755426","count":2},{"lng":"113.211836","lat":"35.234608","count":6},{"lng":"114.351642","lat":"34.801854","count":7},{"lng":"112.447525","lat":"34.657368","count":1},{"lng":"114.046061","lat":"33.576279","count":9},{"lng":"112.542842","lat":"33.01142","count":0},{"lng":"113.300849","lat":"33.745301","count":1},{"lng":"115.026627","lat":"35.753298","count":4},{"lng":"111.181262","lat":"34.78332","count":0},{"lng":"115.641886","lat":"34.438589","count":5},{"lng":"113.91269","lat":"35.307258","count":0},{"lng":"114.085491","lat":"32.128582","count":3},{"lng":"113.835312","lat":"34.02674","count":1},{"lng":"114.654102","lat":"33.623741","count":6},{"lng":"114.049154","lat":"32.983158","count":4},{"lng":"126.657717","lat":"45.773225","count":9},{"lng":"125.02184","lat":"46.596709","count":0},{"lng":"124.196104","lat":"51.991789","count":2},{"lng":"130.292472","lat":"47.338666","count":5},{"lng":"127.50083","lat":"50.25069","count":9},{"lng":"130.941767","lat":"45.32154","count":0},{"lng":"130.284735","lat":"46.81378","count":0},{"lng":"129.608035","lat":"44.588521","count":8},{"lng":"131.019048","lat":"45.775005","count":2},{"lng":"123.987289","lat":"47.3477","count":8},{"lng":"131.171402","lat":"46.655102","count":1},{"lng":"126.989095","lat":"46.646064","count":0},{"lng":"128.910766","lat":"47.734685","count":3},{"lng":"114.3162","lat":"30.581084","count":2},{"lng":"114.895594","lat":"30.384439","count":6},{"lng":"109.517433","lat":"30.308978","count":8},{"lng":"114.906618","lat":"30.446109","count":5},{"lng":"115.050683","lat":"30.216127","count":2},{"lng":"112.21733","lat":"31.042611","count":1},{"lng":"112.241866","lat":"30.332591","count":6},{"lng":"112.768768","lat":"30.343116","count":0},{"lng":"110.487231","lat":"31.595768","count":1},{"lng":"110.801229","lat":"32.636994","count":7},{"lng":"113.379358","lat":"31.717858","count":0},{"lng":"113.12623","lat":"30.649047","count":2},{"lng":"113.387448","lat":"30.293966","count":8},{"lng":"114.300061","lat":"29.880657","count":1},{"lng":"112.176326","lat":"32.094934","count":8},{"lng":"113.935734","lat":"30.927955","count":8},{"lng":"111.310981","lat":"30.732758","count":4},{"lng":"112.979353","lat":"28.213478","count":2},{"lng":"111.653718","lat":"29.012149","count":0},{"lng":"113.037704","lat":"25.782264","count":5},{"lng":"112.583819","lat":"26.898164","count":9},{"lng":"109.986959","lat":"27.557483","count":1},{"lng":"111.996396","lat":"27.741073","count":2},{"lng":"111.461525","lat":"27.236811","count":6},{"lng":"112.935556","lat":"27.835095","count":2},{"lng":"109.745746","lat":"28.317951","count":9},{"lng":"112.366547","lat":"28.588088","count":3},{"lng":"111.614648","lat":"26.435972","count":2},{"lng":"113.146196","lat":"29.378007","count":3},{"lng":"110.48162","lat":"29.124889","count":9},{"lng":"113.131695","lat":"27.827433","count":9},{"lng":"118.778074","lat":"32.057236","count":7},{"lng":"119.981861","lat":"31.771397","count":2},{"lng":"119.030186","lat":"33.606513","count":2},{"lng":"119.173872","lat":"34.601549","count":9},{"lng":"120.873801","lat":"32.014665","count":8},{"lng":"120.619907","lat":"31.317987","count":8},{"lng":"118.296893","lat":"33.95205","count":7},{"lng":"119.919606","lat":"32.476053","count":2},{"lng":"120.305456","lat":"31.570037","count":2},{"lng":"117.188107","lat":"34.271553","count":0},{"lng":"120.148872","lat":"33.379862","count":1},{"lng":"119.427778","lat":"32.408505","count":2},{"lng":"119.455835","lat":"32.204409","count":8},{"lng":"115.893528","lat":"28.689578","count":6},{"lng":"116.360919","lat":"27.954545","count":6},{"lng":"114.935909","lat":"25.845296","count":5},{"lng":"114.992039","lat":"27.113848","count":3},{"lng":"117.186523","lat":"29.303563","count":3},{"lng":"115.999848","lat":"29.71964","count":8},{"lng":"113.859917","lat":"27.639544","count":6},{"lng":"117.955464","lat":"28.457623","count":0},{"lng":"114.947117","lat":"27.822322","count":5},{"lng":"114.400039","lat":"27.81113","count":2},{"lng":"117.03545","lat":"28.24131","count":8},{"lng":"125.313642","lat":"43.898338","count":8},{"lng":"122.840777","lat":"45.621086","count":0},{"lng":"126.435798","lat":"41.945859","count":7},{"lng":"126.564544","lat":"43.871988","count":8},{"lng":"125.133686","lat":"42.923303","count":3},{"lng":"124.391382","lat":"43.175525","count":7},{"lng":"124.832995","lat":"45.136049","count":7},{"lng":"125.94265","lat":"41.736397","count":2},{"lng":"129.485902","lat":"42.896414","count":7},{"lng":"123.432791","lat":"41.808645","count":7},{"lng":"123.007763","lat":"41.118744","count":0},{"lng":"123.778062","lat":"41.325838","count":0},{"lng":"120.446163","lat":"41.571828","count":1},{"lng":"121.593478","lat":"38.94871","count":6},{"lng":"124.338543","lat":"40.129023","count":9},{"lng":"123.92982","lat":"41.877304","count":8},{"lng":"121.660822","lat":"42.01925","count":4},{"lng":"120.860758","lat":"40.74303","count":9},{"lng":"121.147749","lat":"41.130879","count":2},{"lng":"123.172451","lat":"41.273339","count":8},{"lng":"122.073228","lat":"41.141248","count":4},{"lng":"123.85485","lat":"42.299757","count":3},{"lng":"122.233391","lat":"40.668651","count":5},{"lng":"111.660351","lat":"40.828319","count":4},{"lng":"105.695683","lat":"38.843075","count":6},{"lng":"109.846239","lat":"40.647119","count":0},{"lng":"107.423807","lat":"40.76918","count":3},{"lng":"118.930761","lat":"42.297112","count":8},{"lng":"109.993706","lat":"39.81649","count":0},{"lng":"119.760822","lat":"49.201636","count":7},{"lng":"122.260363","lat":"43.633756","count":1},{"lng":"106.831999","lat":"39.683177","count":4},{"lng":"113.112846","lat":"41.022363","count":6},{"lng":"116.02734","lat":"43.939705","count":4},{"lng":"122.048167","lat":"46.083757","count":6},{"lng":"106.206479","lat":"38.502621","count":7},{"lng":"106.285268","lat":"36.021523","count":5},{"lng":"106.379337","lat":"39.020223","count":3},{"lng":"106.208254","lat":"37.993561","count":1},{"lng":"105.196754","lat":"37.521124","count":1},{"lng":"101.767921","lat":"36.640739","count":0},{"lng":"100.223723","lat":"34.480485","count":5},{"lng":"102.085207","lat":"36.51761","count":6},{"lng":"100.879802","lat":"36.960654","count":7},{"lng":"100.624066","lat":"36.284364","count":0},{"lng":"97.342625","lat":"37.373799","count":2},{"lng":"102.0076","lat":"35.522852","count":9},{"lng":"97.013316","lat":"33.00624","count":7},{"lng":"117.024967","lat":"36.682785","count":4},{"lng":"117.968292","lat":"37.405314","count":4},{"lng":"118.583926","lat":"37.487121","count":9},{"lng":"116.328161","lat":"37.460826","count":0},{"lng":"115.46336","lat":"35.26244","count":9},{"lng":"116.600798","lat":"35.402122","count":1},{"lng":"117.684667","lat":"36.233654","count":4},{"lng":"115.986869","lat":"36.455829","count":0},{"lng":"118.340768","lat":"35.072409","count":9},{"lng":"120.384428","lat":"36.105215","count":6},{"lng":"119.50718","lat":"35.420225","count":8},{"lng":"117.089415","lat":"36.188078","count":9},{"lng":"122.093958","lat":"37.528787","count":9},{"lng":"119.142634","lat":"36.716115","count":2},{"lng":"121.309555","lat":"37.536562","count":4},{"lng":"117.279305","lat":"34.807883","count":8},{"lng":"118.059134","lat":"36.804685","count":8},{"lng":"112.550864","lat":"37.890277","count":5},{"lng":"113.120292","lat":"36.201664","count":0},{"lng":"113.290509","lat":"40.113744","count":5},{"lng":"112.867333","lat":"35.499834","count":4},{"lng":"112.738514","lat":"37.693362","count":2},{"lng":"111.538788","lat":"36.099745","count":6},{"lng":"111.143157","lat":"37.527316","count":3},{"lng":"112.479928","lat":"39.337672","count":1},{"lng":"112.727939","lat":"38.461031","count":3},{"lng":"113.569238","lat":"37.869529","count":1},{"lng":"111.006854","lat":"35.038859","count":7},{"lng":"108.953098","lat":"34.2778","count":6},{"lng":"109.038045","lat":"32.70437","count":0},{"lng":"107.170645","lat":"34.364081","count":4},{"lng":"107.045478","lat":"33.081569","count":8},{"lng":"109.934208","lat":"33.873907","count":8},{"lng":"108.968067","lat":"34.908368","count":9},{"lng":"109.483933","lat":"34.502358","count":2},{"lng":"108.707509","lat":"34.345373","count":9},{"lng":"109.50051","lat":"36.60332","count":5},{"lng":"109.745926","lat":"38.279439","count":3},{"lng":"104.067923","lat":"30.679943","count":8},{"lng":"102.228565","lat":"31.905763","count":5},{"lng":"106.757916","lat":"31.869189","count":1},{"lng":"107.494973","lat":"31.214199","count":4},{"lng":"104.402398","lat":"31.13114","count":0},{"lng":"101.969232","lat":"30.055144","count":6},{"lng":"106.63572","lat":"30.463984","count":2},{"lng":"105.819687","lat":"32.44104","count":5},{"lng":"103.760824","lat":"29.600958","count":2},{"lng":"102.259591","lat":"27.892393","count":9},{"lng":"105.44397","lat":"28.89593","count":6},{"lng":"106.105554","lat":"30.800965","count":3},{"lng":"103.84143","lat":"30.061115","count":9},{"lng":"104.705519","lat":"31.504701","count":7},{"lng":"105.073056","lat":"29.599462","count":2},{"lng":"101.722423","lat":"26.587571","count":1},{"lng":"105.564888","lat":"30.557491","count":0},{"lng":"103.009356","lat":"29.999716","count":3},{"lng":"104.633019","lat":"28.769675","count":1},{"lng":"104.63593","lat":"30.132191","count":7},{"lng":"104.776071","lat":"29.359157","count":7},{"lng":"91.111891","lat":"29.662557","count":7},{"lng":"81.107669","lat":"30.404557","count":6},{"lng":"97.185582","lat":"31.140576","count":2},{"lng":"94.349985","lat":"29.666941","count":8},{"lng":"92.067018","lat":"31.48068","count":7},{"lng":"88.891486","lat":"29.269023","count":6},{"lng":"91.750644","lat":"29.229027","count":2},{"lng":"87.564988","lat":"43.84038","count":2},{"lng":"81.291737","lat":"40.61568","count":3},{"lng":"80.269846","lat":"41.171731","count":1},{"lng":"88.137915","lat":"47.839744","count":5},{"lng":"86.121688","lat":"41.771362","count":0},{"lng":"82.052436","lat":"44.913651","count":8},{"lng":"87.296038","lat":"44.007058","count":7},{"lng":"93.528355","lat":"42.858596","count":3},{"lng":"79.930239","lat":"37.116774","count":4},{"lng":"75.992973","lat":"39.470627","count":7},{"lng":"84.88118","lat":"45.594331","count":3},{"lng":"76.137564","lat":"39.750346","count":3},{"lng":"86.041865","lat":"44.308259","count":2},{"lng":"82.974881","lat":"46.758684","count":1},{"lng":"79.198155","lat":"39.889223","count":6},{"lng":"89.181595","lat":"42.96047","count":3},{"lng":"87.565449","lat":"44.368899","count":4},{"lng":"81.297854","lat":"43.922248","count":5},{"lng":"102.714601","lat":"25.049153","count":8},{"lng":"99.177996","lat":"25.120489","count":1},{"lng":"101.529382","lat":"25.066356","count":5},{"lng":"100.223675","lat":"25.5969","count":5},{"lng":"98.589434","lat":"24.44124","count":7},{"lng":"99.713682","lat":"27.831029","count":3},{"lng":"103.384065","lat":"23.367718","count":6},{"lng":"100.229628","lat":"26.875351","count":5},{"lng":"100.092613","lat":"23.887806","count":9},{"lng":"98.859932","lat":"25.860677","count":9},{"lng":"100.980058","lat":"22.788778","count":8},{"lng":"103.782539","lat":"25.520758","count":3},{"lng":"103.725021","lat":"27.340633","count":1},{"lng":"104.089112","lat":"23.401781","count":9},{"lng":"100.803038","lat":"22.009433","count":2},{"lng":"102.545068","lat":"24.370447","count":3},{"lng":"120.219375","lat":"30.259244","count":2},{"lng":"120.137243","lat":"30.877925","count":9},{"lng":"120.760428","lat":"30.773992","count":2},{"lng":"119.652576","lat":"29.102899","count":8},{"lng":"119.929576","lat":"28.4563","count":0},{"lng":"121.579006","lat":"29.885259","count":7},{"lng":"118.875842","lat":"28.95691","count":5},{"lng":"120.592467","lat":"30.002365","count":7},{"lng":"121.440613","lat":"28.668283","count":3},{"lng":"120.690635","lat":"28.002838","count":2},{"lng":"122.169872","lat":"30.03601","count":1}];
    var inmap = new inMap.Map({
        id: 'allmap',
        skin: "Blueness",
        center: [105.403119, 38.028658],
        zoom: {
            value: 5,
            show: true,
            max: 18,
            min: 5
        },
    })
    var overlay = new inMap.DotOverlay({
        tooltip: {
            show: true,
            position: 'top',
            formatter: "{count}"
        },
        legend: {
            show: true,
            title: "标题",
            data: ["描述1", "描述2", "描述3", "描述4"],
            formatter: function (start, end) {
                return start + "万~" + (end || "max") + "万";
            }
        },
        style: {
            normal: {
                backgroundColor: 'rgba(200, 200, 50, 1)',
                borderWidth: 1,
                borderColor: "rgba(255,255,255,1)",
                size: 10,
            },
            mouseOver: {
                backgroundColor: 'rgba(200, 200, 200, 1)',
                borderColor: "rgba(255,255,255,1)",
                borderWidth: 4,
            },
            selected: {
                backgroundColor: 'rgba(184,0,0,1)',
                borderColor: "rgba(255,255,255,1)"
            },
            splitList: [{ //设置区间颜色
                    start: 0,
                    end: 2,
                    size: 3,
                },
                {
                    start: 2,
                    end: 5,
                    size: 6,
                },
                {
                    start: 5,
                    end: 7,
                    size: 9,
                },
                {
                    start: 7,
                    size: 12,
                }
            ],
        },
        data: data,
        event: {
            onMouseClick: function (item, event) {
                //能获取当前点的信息
            }
        }
    });
    inmap.add(overlay);
</script>

效果截图

浏览 6
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑 分享
举报