zoukankan      html  css  js  c++  java
  • THINKPHP+JS缩放图片式截图的实现

    作者:杨鑫奇

    原始链接:http://www.cnblogs.com/scotoma/archive/2010/03/05/1679477.html

    声明

    本博文转载请注明作者和出处,鄙视转载文章还删改内容的LJ,在TP论坛潜水很久了,光看不做点贡献是不行的,呵呵!在这里得到了老大和国的照顾,这段时间将原来的项目里面的一些值得分享的拿出来和大家一起分享了!希望多多各位指教!THINKPHP,I love you.

    今晚TP论坛的一位大哥加我了,说也遇到这个方面的问题,呵呵!想想其实很多东西都遇到了,是不是应该分享出来呢?其实自己的很多东西都是别人那来的,取之于网络用之于网络!只有大家多分享,才能够提高!

    实现方式

    上传图片 -- 保存并显示图片 -- JS获取缩略图参数 -- 提交位置参数 -- 图片缩放保存类处理图片 -- 保存截取的图片--更新数据库 -- 跳转

    上几张截图

    以下是实例截图

    主要的实现代码

    1 public function cutimg()
    2 {
    3 $result = $this->upload('temp');
    4 if (!is_array($result))
    5 {
    6 $this->redirect('index');
    7 }
    8 else
    9 {
    10 $this->assign('imgurl', '__ROOT__/' . C('ATTACHDIR') . '/temp/' . $result[0]['savename']);
    11 $this->assign('imgname', $result[0]['savename']);
    12 $this->display();
    13 }
    14 }
    1 public function setavatar()
    2 {
    3 if (!empty($_REQUEST['cut_pos']))
    4 {
    5 // import('ORG.Util.ImageResize');
    6   require('ImageResize.class.php');
    7 $imgresize = new ImageResize();
    8 // use the full path
    9   $url = C('ATTACHDIR') . '/temp/' . trim($_POST['imgname']);
    10 $imgresize->load($url);
    11 dump($url);
    12 $posary = explode(',', $_REQUEST['cut_pos']);
    13 foreach($posary as $k => $v)
    14
    15 $posary[$k] = intval($v);
    16
    17 if ($posary[2] > 0 && $posary[3] > 0) $imgresize->resize($posary[2], $posary[3]);
    18
    19 dump($posary);
    20 // create filename rule
    21   $uico = time() . '.jpg';
    22 dump($uico);
    23 $path = C('AVATAR');
    24 // save 120*120 image
    25   $imgresize->cut(120, 120, intval($posary[0]), intval($posary[1]));
    26 $large = 'l_' . $uico;
    27 $imgresize->save($path . $large);
    28
    29 echo '<img src="'.__ROOT__.'/' . $path . $large . '" />';
    30 // update database
    31   }
    32 else
    33 {
    34 // error reporting
    35   }
    36 }

    源代码下载地址: 点击下载  其他的自己去完善了,运行需要TP框架请访问 http://www.thinkphp.cn 下载,然后下载扩展包,因为用到Upload类!

    //------------------------------------------------------------------------------------------------

    20100321更新

    修改了图片 定位到中心 增加了用户体验功能,本功能有 阿粪 同学所写,在此表示感谢呵呵,还要感谢原来JS的作者

    具体修改如下:

    文件路径/tpl/default/index/cutimg.html

    imageresize(flag) 函数内最后一行添加 rePosition();//新增 266行

    grip_Drag(clientX, clientY) 函数内最后一行添加

    文件尾部添加

    //重新定位图片位置

    function rePosition(){


    cut_img.style.left = Math.round(divx/2 - (divx/2-oldMoveLeft)*zoom/oldzoom) + "px";

    cut_img.style.top = Math.round((divy/2+oldMoveTop)*zoom/oldzoom - divy/2) + "px";


    }

    再次感谢阿粪同学!呵呵!

  • 相关阅读:
    JDBC 复习4 批量执行SQL
    JDBC 复习3 存取Oracle大数据 clob blob
    Oracle复习
    Linux命令(1)grep
    JDBC 复习2 存取mysql 大数据
    JDBC 复习1 DBUtil
    php 环境搭建问题
    Windows 批处理 bat 开启 WiFi 菜单选项 设置ID PWD
    Bat 批处理启动和停止Oracle 服务
    docker 学习1 WSL docker ,Windows docker
  • 原文地址:https://www.cnblogs.com/scotoma/p/1679477.html
Copyright © 2011-2022 走看看