标签：cluster clusteredEntities billboard 聚簇 var Cesium image

Cesium聚簇

上篇中 已经出现了 很多图元的时候 性能优化的事 ，但是地图上 会有密密麻麻的各种图标 或者文字

这就要用到 聚簇了

 	var dataSourceForCluster = new Cesium.CustomDataSource('cluster');
    var count = 100000;
    for (var i = 0; i < count; ++i) {
        dataSourceForCluster.entities.add({
            id: "" + i,
            position: new Cesium.Cartesian3.fromDegrees(Math.random() * 100, Math.random() * 100, 10000),
            billboard: {
                image: '../src/assets/image/wx.png',
                height: 30,
                width: 30
            }
        });
    }
    var dataSourcePromise = viewer.dataSources.add(dataSourceForCluster);
    dataSourcePromise.then(function (dataSource) {
        var pixelRange = 15;
        var minimumClusterSize = 3;
        var enabled = true;
        dataSource.clustering.enabled = enabled;
        dataSource.clustering.pixelRange = pixelRange;
        dataSource.clustering.minimumClusterSize = minimumClusterSize;

        var pinBuilder = new Cesium.PinBuilder();
        var pin50 = pinBuilder.fromText('50+', Cesium.Color.RED, 48).toDataURL();
        var pin40 = pinBuilder.fromText('40+', Cesium.Color.ORANGE, 48).toDataURL();
        var pin30 = pinBuilder.fromText('30+', Cesium.Color.YELLOW, 48).toDataURL();
        var pin20 = pinBuilder.fromText('20+', Cesium.Color.GREEN, 48).toDataURL();
        var pin10 = pinBuilder.fromText('10+', Cesium.Color.BLUE, 48).toDataURL();

        var singleDigitPins = new Array(8);
        for (var i = 0; i < singleDigitPins.length; ++i) {
            singleDigitPins[i] = pinBuilder.fromText('' + (i + 2), Cesium.Color.VIOLET, 48).toDataURL();
        }
        dataSource.clustering.clusterEvent.addEventListener(function (clusteredEntities, cluster) {
            cluster.label.show = false;
            cluster.billboard.show = true;
            cluster.billboard.id = cluster.label.id;
            cluster.billboard.verticalOrigin = Cesium.VerticalOrigin.BOTTOM;

            if (clusteredEntities.length >= 50) {
                cluster.billboard.image = pin50;
            } else if (clusteredEntities.length >= 40) {
                cluster.billboard.image = pin40;
            } else if (clusteredEntities.length >= 30) {
                cluster.billboard.image = pin30;
            } else if (clusteredEntities.length >= 20) {
                cluster.billboard.image = pin20;
            } else if (clusteredEntities.length >= 10) {
                cluster.billboard.image = pin10;
            } else {
                cluster.billboard.image = singleDigitPins[clusteredEntities.length - 2];
            }
        });
    });

标签：cluster,clusteredEntities,billboard,聚簇,var,Cesium,image
来源： https://www.cnblogs.com/little-oil/p/16636084.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。