教你用Matlab制作立体动态相册

目录
  • 效果
  • 教程部分
    • 1图片导入与大小重设
    • 2figaxes设置
    • 3绘制图形句柄
    • 4立方体旋转
    • 5获取鼠标与中心点的距离
    • 6鼠标移动到fig中心时更新图片
  • 完整代码

效果

教程部分

1 图片导入与大小重设

需要有一个名为album的文件夹和当前m文件在同一文件夹,另外ablum文件夹内至少要有一张jpg格式图片

path='.\album\';%文件夹名称
files=dir(fullfile(path,'*.jpg'));
picNum=size(files,1);

%遍历路径下每一幅图像
for i=1:picNum
   fileName=strcat(path,files(i).name);
   img=imread(fileName);
   img=imresize(img,[120,120]);
   imgSet{i}=img;
end

我们注意到,这里用了一次imresize将突破变为120x120大小,这里重设大小有三个作用:

  • 将不是方形的图片变为方形
  • 将图像设置固定大小,方便构造网格放置图片
  • 120x120的大小大约是能让图片表示清晰为前提下最小的大小,图片太大的话运行会卡,太小的话不清晰

2 fig axes设置

% fig axes设置
fig=figure('units','pixels','position',[50 50 600 600],...
                       'Numbertitle','off','resize','off',...
                       'name','album3d','menubar','none');
ax=axes('parent',fig,'position',[-0.5 -0.5 2 2],...
   'XLim', [-6 6],...
   'YLim', [-6 6],...
   'ZLim', [-6 6],...
   'Visible','on',...
   'XTick',[], ...
   'YTick',[],...
   'Color',[0 0 0],...
   'DataAspectRatioMode','manual',...
   'CameraPositionMode','manual');
hold(ax,'on')

大部分设置大家都能看懂,这里讲解一下一些比较少见的设置:

2.1 为什么 axes的’position’属性不设置[0 0 1 1]?

因为是3D坐标轴,设置为[0 0 1 1]后旋转起来效果是这样的,所以我们axes要设置的比figure大一圈:

2.2 为什么要设置CameraPositionMode这一奇怪的属性?

因为我们后期要频繁改变CameraPosition这一属性,而CameraPositionMode设置为manual可以让视角完全按照CameraPosition的数值来调整,至于为什么要调整视角呢?

当然是因为如果对图像位置数据进行处理数据量会贼大,因此我们不妨直接转动axes视角而非转动图片。

3 绘制图形句柄

就是绘制小型立方体,中型立方体和大型立方体,其中鼠标移动到中型立方体中心时中型立方体变成大型立方体,这个可以靠设置图形对象的XData,YData,ZData数值来改变

3.1 构造网格

由于surf曲面图可以将图像贴在上面,还可以设置透明度,我们决定用surf函数来绘制,要贴图首先要将曲面绘制出来,就要先构造曲面网格:

% 用于绘制图片的网格
[XMesh,YMesh]=meshgrid(linspace(-1,1,120),linspace(-1,1,120));
ZMesh=ones(120,120);

3.2 绘制小型立方体

% 绘制图片立方体
surfPic(1)=surf(XMesh,YMesh,ZMesh,'CData',imgSet{mod(0,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(2)=surf(XMesh,YMesh(end:-1:1,:),-ZMesh,'CData',imgSet{mod(1,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(3)=surf(ZMesh,XMesh,YMesh(end:-1:1,:),'CData',imgSet{mod(2,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(4)=surf(XMesh,ZMesh,YMesh(end:-1:1,:),'CData',imgSet{mod(3,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(5)=surf(-ZMesh,XMesh,YMesh(end:-1:1,:),'CData',imgSet{mod(4,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(6)=surf(XMesh,-ZMesh,YMesh(end:-1:1,:),'CData',imgSet{mod(5,picNum)+1},'EdgeColor','none','FaceColor','interp');

3.3 绘制中型立方体

有了小型立方体,中型的绘制起来就简单了起来,甚至可以用一个for循环解决,只需要循环提取小型立方体的XData,YData,ZData数据后乘以1.5绘制图像,并设置透明度即可:

% 依靠小立方体数据绘制中等立方体
for i=1:6
    surfPicA(i)=surf(surfPic(i).XData.*1.5,surfPic(i).YData.*1.5,surfPic(i).ZData.*1.5,...
        'CData',surfPic(i).CData,'EdgeColor','none','FaceColor','interp','FaceAlpha',0.7);
end

3.4 大型立方体参数设置

大型立方体参数设置时就没那么简单,如果直接乘以2.5,图片与图片之间会没有缝隙,因此我们XData,YData,ZData数据虽然都要变大,但是要乘以不一样的数值,而且各个方向上乘的数值不同,因此我们可以事先设立一个矩阵,用来存储其参数:

% 用来调整放大比例的矩阵
resizeMat=[2 2 2.5;2 2 2.5;2.5 2 2;
           2 2.5 2;2.5 2 2;2 2.5 2];

想直接画大型正方形可以试试如下代码:

% 最大图片绘制
% for i=1:6
%     surfPicB(i)=surf(surfPic(i).XData.*resizeMat(i,1),...
%                      surfPic(i).YData.*resizeMat(i,2),...
%                      surfPic(i).ZData.*resizeMat(i,3),...
%                      'CData',surfPic(i).CData,'EdgeColor',...
%                      'none','FaceColor','interp','FaceAlpha',0.7);
% end

4 立方体旋转

我们只需要设置一个timer函数不断调整CameraPosition即可:

fps=40;theta=0;
rotateTimer=timer('ExecutionMode', 'FixedRate', 'Period',1/fps, 'TimerFcn', @rotateCube);
start(rotateTimer)

    function rotateCube(~,~)
        theta=theta+0.02;
        ax.CameraPosition=[cos(theta)*5*sqrt(2),sin(theta)*5*sqrt(2),5];
    end

5 获取鼠标与中心点的距离

本来想直接在timer调用的函数里写get(fig,‘CurrentPoint’);来获得鼠标当前位置的,但发现这样写只有鼠标点击窗口才会有反应,并不是鼠标移动就会有反应,因此我们再构造一个WindowButtonMotionFcn回调,!!!这一部分代码要写在上一步代码的前面!!!

lastDis=300;
preDis=300;
set(fig,'WindowButtonMotionFcn',@move2center)
    function move2center(~,~)
        xy=get(fig,'CurrentPoint');
        preDis=sqrt(sum((xy-[300,300]).^2));
    end

preDis就是鼠标到图片中心的位置,我为什么要设置一个lastDis呢,因为每次移动鼠标都更新图像实在太卡了,因此我们要加一个判定,当且仅当以下两种情况更新图片大小

  • 之前鼠标距离中心>=150,现在<150
  • 之前鼠标距离中心<150,现在>=150

6 鼠标移动到fig中心时更新图片

将之前的rotateCube函数改成这样:

function rotateCube(~,~)
        theta=theta+0.02;
        ax.CameraPosition=[cos(theta)*5*sqrt(2),sin(theta)*5*sqrt(2),5];
        if (~all([preDis lastDis]<150))&&any([preDis lastDis]<150)
            for ii=1:6
                if preDis<150
                    surfPicA(ii).XData=surfPic(ii).XData.*resizeMat(ii,1);
                    surfPicA(ii).YData=surfPic(ii).YData.*resizeMat(ii,2);
                    surfPicA(ii).ZData=surfPic(ii).ZData.*resizeMat(ii,3);
                else
                    surfPicA(ii).XData=surfPic(ii).XData.*1.5;
                    surfPicA(ii).YData=surfPic(ii).YData.*1.5;
                    surfPicA(ii).ZData=surfPic(ii).ZData.*1.5;
                end
            end
        end
        lastDis=preDis;
    end

其中:

(~all([preDis lastDis]<150))&&any([preDis lastDis]<150)

是用来判断上一次鼠标位置和当前鼠标位置是否只有一个距离中心<150

另:

for 循环中使用else来判断应该绘制大图片还是中等图片

完整代码

function album3d
path='.\album\';%文件夹名称
files=dir(fullfile(path,'*.jpg'));
picNum=size(files,1);

%遍历路径下每一幅图像
for i=1:picNum
   fileName=strcat(path,files(i).name);
   img=imread(fileName);
   img=imresize(img,[120,120]);
   imgSet{i}=img;
end

% fig axes设置
fig=figure('units','pixels','position',[50 50 600 600],...
                       'Numbertitle','off','resize','off',...
                       'name','album3d','menubar','none');
ax=axes('parent',fig,'position',[-0.5 -0.5 2 2],...
   'XLim', [-6 6],...
   'YLim', [-6 6],...
   'ZLim', [-6 6],...
   'Visible','on',...
   'XTick',[], ...
   'YTick',[],...
   'Color',[0 0 0],...
   'DataAspectRatioMode','manual',...
   'CameraPositionMode','manual');
hold(ax,'on')
ax.CameraPosition=[5 5 5];

% 用于绘制图片的网格
[XMesh,YMesh]=meshgrid(linspace(-1,1,120),linspace(-1,1,120));
ZMesh=ones(120,120);

% 绘制图片立方体
surfPic(1)=surf(XMesh,YMesh,ZMesh,'CData',imgSet{mod(0,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(2)=surf(XMesh,YMesh(end:-1:1,:),-ZMesh,'CData',imgSet{mod(1,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(3)=surf(ZMesh,XMesh,YMesh(end:-1:1,:),'CData',imgSet{mod(2,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(4)=surf(XMesh,ZMesh,YMesh(end:-1:1,:),'CData',imgSet{mod(3,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(5)=surf(-ZMesh,XMesh,YMesh(end:-1:1,:),'CData',imgSet{mod(4,picNum)+1},'EdgeColor','none','FaceColor','interp');
surfPic(6)=surf(XMesh,-ZMesh,YMesh(end:-1:1,:),'CData',imgSet{mod(5,picNum)+1},'EdgeColor','none','FaceColor','interp');

% 依靠小立方体数据绘制中等立方体
for i=1:6
    surfPicA(i)=surf(surfPic(i).XData.*1.5,surfPic(i).YData.*1.5,surfPic(i).ZData.*1.5,...
        'CData',surfPic(i).CData,'EdgeColor','none','FaceColor','interp','FaceAlpha',0.7);
end

% 用来调整放大比例的矩阵
resizeMat=[2 2 2.5;2 2 2.5;2.5 2 2;
           2 2.5 2;2.5 2 2;2 2.5 2];

% 最大图片绘制
% for i=1:6
%     surfPicB(i)=surf(surfPic(i).XData.*resizeMat(i,1),...
%                      surfPic(i).YData.*resizeMat(i,2),...
%                      surfPic(i).ZData.*resizeMat(i,3),...
%                      'CData',surfPic(i).CData,'EdgeColor',...
%                      'none','FaceColor','interp','FaceAlpha',0.7);
% end     

lastDis=300;
preDis=300;
set(fig,'WindowButtonMotionFcn',@move2center)
    function move2center(~,~)
        xy=get(fig,'CurrentPoint');
        preDis=sqrt(sum((xy-[300,300]).^2));
    end

fps=40;theta=0;
rotateTimer=timer('ExecutionMode', 'FixedRate', 'Period',1/fps, 'TimerFcn', @rotateCube);
start(rotateTimer)

    function rotateCube(~,~)
        theta=theta+0.02;
        ax.CameraPosition=[cos(theta)*5*sqrt(2),sin(theta)*5*sqrt(2),5];
        if (~all([preDis lastDis]<150))&&any([preDis lastDis]<150)
            for ii=1:6
                if preDis<150
                    surfPicA(ii).XData=surfPic(ii).XData.*resizeMat(ii,1);
                    surfPicA(ii).YData=surfPic(ii).YData.*resizeMat(ii,2);
                    surfPicA(ii).ZData=surfPic(ii).ZData.*resizeMat(ii,3);
                else
                    surfPicA(ii).XData=surfPic(ii).XData.*1.5;
                    surfPicA(ii).YData=surfPic(ii).YData.*1.5;
                    surfPicA(ii).ZData=surfPic(ii).ZData.*1.5;
                end
            end
        end
        lastDis=preDis;
    end

% 弃用方案:太卡
% set(fig,'WindowButtonMotionFcn',@move2center)
%     function move2center(~,~)
%         xy=get(fig,'CurrentPoint');
%         dis=sum((xy-[300,300]).^2);
%         for ii=1:6
%             if dis<200
%                 surfPicA(ii).XData=surfPic(ii).XData.*resizeMat(ii,1);
%                 surfPicA(ii).YData=surfPic(ii).YData.*resizeMat(ii,2);
%                 surfPicA(ii).ZData=surfPic(ii).ZData.*resizeMat(ii,3);
%             else
%                 surfPicA(ii).XData=surfPic(ii).XData;
%                 surfPicA(ii).YData=surfPic(ii).YData;
%                 surfPicA(ii).ZData=surfPic(ii).ZData;
%             end
%         end
%
%
%
%     end

end

以上就是教你用Matlab制作立体动态相册的详细内容,更多关于Matlab制作立体相册的资料请关注我们其它相关文章!

(0)

相关推荐

  • 利用Matlab绘制一个可爱的南瓜灯

    目录 效果及原理 原理 实现方法 完整代码 效果及原理 效果如下: 调一下数据还能改成三角眼: 原理 南瓜主体函数从知友 [九章算法] 的一张图而来,大体是瓜身瓜柄分段函数,然后绕着z轴旋转一周得到曲面,我对数值做了微调,原图及原始数据: 实现方法 这里我故意保留了网格让南瓜看起来有一点布娃娃的感觉,(大家也可以根据自己喜好改写,例如将’EdgeColor’设置为’none’并打个光啥的) % 构造网格 [t,p]=meshgrid(linspace(0,2*pi,200),linspace(0

  • 利用Matlab制作抖音同款含褶皱面料图

    目录 效果如下 步骤 1.导入图片 2.图片扩张 3.像素映射 4.正片叠底 5.完整代码 效果如下 步骤 1.导入图片 我们需要导入一张褶皱图片(background.jpg)以及一张前景图片(foreground.jpg),将褶皱图片灰度化,将前景图调整至与褶皱图片相同大小: bkgPic=imread('background.jpg'); bkgPic=rgb2gray(bkgPic); forePic=imread('foreground.jpg'); forePic=imresize(

  • js实现3D旋转相册

    本文实例为大家分享了js实现3D旋转相册的具体代码,供大家参考,具体内容如下 效果展示: 使用图片: 剩余自己随意 图片大小为133*200 代码展示: <!DOCTYPE html> <!--设置图片的拖拽事件 不可用--> <html lang="en" ondragstart="return false"> <head> <meta charset="UTF-8"> <tit

  • Matlab绘制中国地图超全教程详解

    目录 各省边界线绘图 省份填色图 中国公路交通图 中国铁路交通图 中国河流图 组合美化图 美化图一 美化图二 依旧需要用到Mapping Toolbox不会安装的可以看我上一篇 虽然我们只读取shp文件,但需要保证文件夹里还有shx文件及dbf文件 各省边界线绘图 provinces=shaperead('bou2_4l.shp','UseGeoCoords',true); % 绘图 worldmap('China'); geoshow(provinces) 省份填色图 provinces=sh

  • JavaScript制作3D旋转相册

    本文实例为大家分享了js 3D旋转相册展示的具体代码,供大家参考,具体内容如下 源代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{padding:0;margin:0; font-family: "Proxima Nova&qu

  • 利用Matlab制作一款刮刮乐抽奖特效

    目录 1.效果展示 2.程序原理说明 2.1奖项设置 2.2随机抽取 2.3绘制图层 2.4滑动鼠标刮奖 3.完整代码 1.效果展示 程序运行效果如下: 如图所示,按住鼠标不松开并滑动鼠标,即可刮开图层: 2.程序原理说明 2.1 奖项设置 奖项设置写在一个cell元胞数组中,第一列为文本信息,第二列为抽到的概率: strSet={'520元红包一个',15/100; '1314元红包一个',5/100; '黑丝水手服',20/100; '黑丝女仆装',20/100; '抱抱×50次',20/1

  • 基于Matlab绘制超绚丽的烟花的过程详解

    目录 1.使用效果 2.随机点生成 3.图像膨胀 4.特效「风」模拟 5.级坐标变换 6.图像模糊及再映射 7.图像上色 8.完整代码 1.使用效果 2.随机点生成 我们要构造一个黑色背景,对其添加高斯噪声,然后依据阈值删掉部分噪声,生成一张随机点图片: % 构造黑色背景并生成白色杂点 blackPic=uint8(zeros(800,800)); distPic=imnoise(blackPic,'gaussian',0, 0.11); distPic(distPic<254)=0; 3.图像

  • 详解Matlab绘制3D玫瑰花的方法(内附旋转版本)

    目录 1.玫瑰花绘制 绘制效果 完整代码 2.月季花绘制 绘制效果 完整代码 3.玫瑰配色 4.旋转版本 1.玫瑰花绘制 绘制效果 完整代码 function drawrose grid on [x,t]=meshgrid((0:24)./24,(0:0.5:575)./575.*20.*pi+4*pi); p=(pi/2)*exp(-t./(8*pi)); change=sin(15*t)/150; u=1-(1-mod(3.6*t,2*pi)./pi).^4./2+change; y=2*(

  • 教你用Matlab制作立体动态相册

    目录 效果 教程部分 1图片导入与大小重设 2figaxes设置 3绘制图形句柄 4立方体旋转 5获取鼠标与中心点的距离 6鼠标移动到fig中心时更新图片 完整代码 效果 教程部分 1 图片导入与大小重设 需要有一个名为album的文件夹和当前m文件在同一文件夹,另外ablum文件夹内至少要有一张jpg格式图片 path='.\album\';%文件夹名称 files=dir(fullfile(path,'*.jpg')); picNum=size(files,1); %遍历路径下每一幅图像 f

  • 教你使用Matlab制作图形验证码生成器(app designer)

    目录 1字符图片生成 2刷新按钮生成 3图片处理 3.1图像任意方向拉伸 3.2字符边缘 3.3图像处理部分代码 4线条和散点生成 5关于图像存储 6关于验证码对比 7完整代码 突然发现cla函数也可以应用到app designer控件上,因而对部分内容做出更改,将绘制隐藏像素刷新的方式改为用cla 原 hold(acAxes,'off'); image(acAxes,[-1,0],[-1,0],ones(1,1,3),'visible','off'); hold(acAxes,'on'); d

  • 教你用Matlab制作黄金矿工小游戏

    目录 效果 步骤 图片准备 背景构建 绘制爪子 让爪子转起来 绘制石块 点击下箭头移动爪子 爪子与石头和边缘碰触判断 抓取石块和显示金钱 完整代码 效果 步骤 图片准备 本文所使用图片在这 背景构建 function goldMiner Mainfig=figure('units','pixels','position',[50 100 750 500],... 'Numbertitle','off','menubar','none','resize','off',... 'name','gol

  • Matlab制作视频并转换成gif动态图的两种方法

    一.第一个方法比较简单,就是使用movie(f)直接取生成AVI视频文件. %% f(t)-->f(4*t+12) 并且验证%% function Signal_change() tic%记录程序运行时间 figure n = 0; t = -2*pi:0.01:2*pi; y = sin(t);%周期为2*pi y_result = sin(4*t); plot(t,y,'b'); xlabel('t'); ylabel('Amplitude'); n = n+1; F(n) = getfra

  • 利用Matlab制作环形相册效果详解

    目录 运行效果 完整步骤 1.图片准备及导入 2.为每张图片制作遮罩层 3.调整每张图大小 4.绘图及绘图参数详解 完整代码 运行效果 完整步骤 1.图片准备及导入 要制作一款相册足够的图片量是必不可少的,不然整个相册只有一张图来回重复多没意思呀,因此我们需要一个文件夹专门放图片,为了方便导入,这里全部都是jpg格式: 图片导入代码: path='.\album\';%文件夹路径 files=dir(fullfile(path,'*.jpg')); picNum=size(files,1); %

  • 用svg制作富有动态的tooltip

    昨晚看了用svg如何制作富有动态的tooltip,于是今天就心血来潮学着做一下,于是也成功做出来,也明白其中的原理,收获颇多阿!接下来要多去学习svg,这是个好东西. 这其中也注意了一些平时纠结的细节应该怎么去做,比如: <article> <section id="sound1"> </section> <section id="sound2"> </section> </article> a

  • Python使用MyQR制作专属动态彩色二维码功能

    Python中有一个非常有趣好玩的库MyQR,不仅可以制作各种漂亮的二维码,还可以生成动态彩色二维码. MyQR是一个能够生成自定义二维码的第三方库,你可以根据需要生成普通二维码.带图片的艺术二维码,也可以生成动态二维码. 生成动态二维码 效果图如下: 二维码扫描上图看看 我们首先要安装MyQR库,直接用pip3 install myqr(or MyQR).需要注意的是MyQR依赖于Python3,在Python2的环境下可能无法正常运行. 这个库提供了两种使用方法,一种是直接使用命令行的方式,

  • CocosCreator入门教程之用TS制作第一个游戏

    前提 无论学什么技术知识,官方文档都应该是你第一个教程,所以请先至少阅读新手上路这一节 http://docs.cocos.com/creator/manual/zh/getting-started/ 再来看这篇文章. 这里假设你已经安装成功了 Cocos Creator. TypeScript VS JavaScript 这里当然只会讲优点: 1. ts 是 js 的超集,所有 js 的语法 ts 都支持. 2. ts 支持接近完美的代码提示,js 代码提示接近于没有. 3. ts 有类型定义

  • 如何利用Matlab制作一款真正的拼图小游戏

    效果: 简单原理介绍: 1构造0,1矩阵作为每片拼图的透明度,可以构造出不规则形状的拼图(image函数有alphaData属性可以设置) jigsawMask=zeros(101*5,101*5); jigsawMask(102:404,102:404)=1; [xMesh,yMesh]=meshgrid(1:101*5,1:101*5); dis1=sqrt((xMesh-51).^2+(yMesh-253).^2); dis2=sqrt((xMesh-505+50).^2+(yMesh-2

  • 撤回我也能看到!教你用Python制作微信防撤回脚本

    一.之前解决方案 大概是这样:短时间内同一位好友发送了多条消息,当他随便撤回一条消息时,我们不能确定他到底撤回的到底是哪一条消息.只能猜他可能是撤回了最近的一条消息,然后将其他消息贴出来作为备选.代码如下: target_msg_pattern = '"{}" 撤回了一条消息'.format(sender_name) if content == target_msg_pattern: return_msg = '[{}]撤回了一条消息:\n'.format(sender_name) i

随机推荐