photomosaic.js给图片打上马赛克

本文中的photomosaic.js马赛克插件原理是让canvas生成各种不同的像素马赛克，并将图片按照其颜色深度用不同颜色的马赛克进行渲染，效果十分逼真。

淘建站为您提供更多_图片代码_图片插件_图片_模糊，在此特别感谢您对我们的支持与厚爱！

图片1打上马赛克

<div class="row">
    <div class="col-xs-12 col-md-6 col-lg-6">
        <img src="img/1.jpg" id='image1' class="img-thumbnail mt10" alt="">
    </div>
    <div class="col-xs-12 col-md-6 col-lg-6">
        <div id='target1'></div>
    </div>
</div>

<script src='src/photomosaic.js'></script>

var photomosaic1 = new PhotoMosaic({
    image: document.getElementById('image1'),
    targetElement: document.getElementById('target1'),
    width: 400,
    height: 400,
    tileWidth: 5,
    tileHeight: 5
});

PhotoMosaic相关API参数