当前位置:首页 » 图片知识 » extjs如何保存图片
扩展阅读
女生和渣男搞笑图片 2023-08-31 22:07:09
嘻嘻长什么样图片 2023-08-31 22:06:10

extjs如何保存图片

发布时间: 2023-05-05 08:02:16

1. Extjs图片显示的问题

你路径写错了
你用的框架应该是play或者maven吧
对于框架裂誉来说,你的根目录其实原本就是src/main/webapp
你alert出来的地址代表系统找图片时的地址是src/main/webapp/src/main/webapp,下面肯定没有个这个目录
你控制台访问也是提示找不到图片,你可以复制那个找不到的地址,然后把其中的src/main/webapp这个路径删除,在浏览器里看能不能找到图片
我觉得你应该是理解错了项目的根目录,其实你localhost:8080/sale-web/就已经是在你项目的src/main/webapp这个目录下键兄了,你肆亮段可以试试
希望能帮助到你

2. extjs图片下载怎么做

呃,这里说2种方法,具体采纳哪种看你自己的需求


web上的图片保存实际有2种方法


你说你的图片已经以列没搜表形式展现出来了,那么实际上右键->图片另存为就可以满足要求了


但是你说你已经做了个下载按钮,那么比较正规的做法应该这样

给这个按钮加一个handler,将图片的主键(路径,野察信或者能在数据库查出的id)传到后台的一个处理页,由处理页以流的形式输出出来,likethis

{
text:'下载',
handler:function(){
location.href='xxx.php?id=xxx'
}
}


由于不知道你的后台用的什么,此处以php为例

<?php
$id=$_GET['id'];
//数据库查询输出图片路径
$file_size=filesize($路径变量);
$fp=fopen($路径变量,'r');
header('Content-Type:application/octet-stream');
header('Accept-Ranges:bytes');
header('Accept-Length:'.$file_size);
header('Content-Disposition:attachment;filename='.$图片名称变量);
echofread($fp,$file_size);
fclose($fp);
?>


至于说extjs能不能直接用js进行图片输出,从我个人经验来看是没有的(也许可能是我见识浅薄,如有此类方法,请教教我~)


虽然extjs的chart的确是颂轮有一个把图片保存为图片的功能,但是那是js绘出的位图,图片是直接从内存输出的,直接图片输出的js我确实没有接触过


希望帮到你,欢迎追问

3. ExtJS4.0图片路径问题,图片没显示,应该放在Eclipse那个目录(ext和html文件都包放在项目WebRoot下)

你的.custom .x-progress-bar样式的内容应该有它原来的样式,但是因为你按照内联的方式来写css,所以里面的这个路径images/xxx就是不对明猛的了。

方法一:改路径定位到extjs包里面运知的这张图片;

方法二:拷贝图片到你页面相对位置的路径激悄桥

4. extjs 3.4中 怎么给htmlEdit添加图片插件 实现图片上传功能

首先要使用extjs自带的HTMLEditor,然后在原有的工具条上添加一个图片按钮,点击这个图片按钮要弹出窗口,这个窗口负责实现上传功能,实现上传后,要将上传的图片路径添加到HTMLEditor的光标处,并且要以<IMG></IMG>的方式,这样HTMLEditor才能解析出来。实现代码如下:

前台JSP页面



fieldLabel : '商品特性',
id : 'shopSp.spTxms',

name : 'shopSp.spTxms',
xtype : 'StarHtmleditor',
anchor : '93%'


这其中引用了StarHtmleditor,StarHtmleditor.js的代码如下简搜,直接将代码复制下来,然后新建个JS,全复制进去就行了。


var HTMLEditor = Ext.extend(Ext.form.HtmlEditor, {
addImage : function() {
var editor = this;
var imgform = new Ext.FormPanel({
region : 'center',
labelWidth : 55,
frame : true,
bodyStyle : 'padding:5px 5px 0',
autoScroll : true,
border : false,
fileUpload : true,
items : [{
xtype : 'textfield',
fieldLabel : '选择文件',
id : 'UserFile',
name : 'UserFile',
inputType : 'file',
allowBlank : false,
blankText : '文件不能为空',
anchor : '90%'
}],
buttons : [{
text : '上传',
handler : function() {
if (!imgform.form.isValid()) {return;}
imgform.form.submit({
waitMsg : '正在上传......',
url : 'HTMLEditorAddImgCommonAction.action',
success : function(form, action) {
var element = document.createElement("img");
element.src = action.result.fileURL;
if (Ext.isIE) {
editor.insertAtCursor(element.outerHTML);
} else {
var selection = editor.win.getSelection();
if (!selection.isCollapsed) {
selection.deleteFromDocument();
}
selection.getRangeAt(0).insertNode(element);
}
//win.hide();//原始方法,但只能传一个图片
颂咐瞎 //更新后的方法
form.reset();
win.close();
},
野空 failure : function(form, action) {
form.reset();
if (action.failureType == Ext.form.Action.SERVER_INVALID)
Ext.MessageBox.alert('警告','上传失败',action.result.errors.msg);
}
});
}
}, {
text : '关闭',
handler : function() {
win.close(this);
}
}]
})

var win = new Ext.Window({
title : "上传图片",
width : 300,
height : 200,
modal : true,
border : false,
iconCls : "picture.png",
layout : "fit",
items : imgform

});
win.show();
},
createToolbar : function(editor) {
HTMLEditor.superclass.createToolbar.call(this, editor);
this.tb.insertButton(16, {
cls : "x-btn-icon",
icon : "picture.png",
handler : this.addImage,
scope : this
});
}
});
Ext.reg('StarHtmleditor', HTMLEditor);

JS的第一句var HTMLEditor = Ext.extend(Ext.form.HtmlEditor, 网上是没有var的,不用var不知道为什么总是报错,另外JS一定要与JSP的编码方式一致,要不然报莫名其妙的错误,而且错误都没有显示。

后台java代码



/****
* HTMLEditor增加上传图片功能:
* 1、上传图片后,需要将图片的位置及图片的名称返回给前台HTMLEditor
* 2、前台HTMLEditor根据返回的值将图片显示出来
* 3、进行统一保存
* @param 上传图片功能
* @return JSON结果
* @throws IOException
*/
public void HTMLEditorAddImg() throws IOException {
if(!"".equals(UserFile) && UserFile != null && UserFile.length() > 0){
File path = ImportImg(UserFile, "jpg");
UserFilePath = "../" + path.toString().replaceAll("\\", "/").substring(path.toString().replaceAll("\\", "/").indexOf("FileImg"));
}
this.getResponse().setContentType("text/html");
this.getResponse().getWriter().write("{success:'true',fileURL:'" + UserFilePath + "'}");
}


特别要注意的是路径问题,路径问题主要有2点需要注意:

1、前台页面引用StarHtmleditor.js的路径一定要正确;

2、Htmleditor上传的图片路径一定要改,因为上传之后图片路径变为http://localhost:8080/,在正常使用中图片不显示,要将该地址替换为服务器的IP地址;替换方法如下:


//获取本地IP地址,因为extjs的htmleditor上传的照片路径有问题,需要将路径替换为本机IP地址
InetAddress inet = InetAddress.getLocalHost();
shopSp.setSpTxms(shopSp.getSpTxms().replace("localhost", inet.getHostAddress().toString()));

这样基本就完成了这个HTMLEditor上传图片功能。

如图:

5. 能不能把ExtJs的chart保存为图片,顺便粘下代码吧

ExtJs chart 使用的丛仿是svg 和 vml画图,自然可以保存为图片,旦郑凳需要把模旅chart的svg源码传到后台转换svg为图片

6. 如何将ExtJs中的chart保存为图片,后台进行。

extjs的chart是web客户祥猛端的,这个图形式有客户端来维护的,是有动态效果的,无法保存为图片的。
如果想要后天服务器来维护一个chart那你可以试试用jfreechart,这个可以在瞎晌服务器端生成一个chart图,然后保存到本地或者写到web去展示磨宴锋。

7. Extjs 如何实现上传及下载功能。

其实,EXTJS4.0中有自带的上传控件 ,你引用一下就行了
关键在于,你上传的文件是保存在数据库中,还是保存在服务器的硬盘上
保存在数据库中要化成二进制流,但缺点是文件大的时候,数据库很麻橘毁烦,并且写进数据库要转换,读出祥历来也要转化
如果保存在服务器上,只在数据库中保存路径,然后就可圆宴备以根据路径来下载,
删除的时候,也同样根据路径要删除服务器上的文件和数据库中的文件信息

祝你好运,如何你不明白的话,我可以给你源码看一下,之前我做的上传,下载和删除功能。

8. extjs多文件上传,如何做类似这种效果,如下图: 如何将上传的文件保存到指定的目录下回答清晰一点

把你上传的程序贴出来吧!就一个图无法讲解

9. extjs怎么显示图片

显示图片可以直接衡桐数使用 Ext.Img...

//下面代码直接从API例子中复制
varchangingImage=咐首Ext.create('Ext.Img',{
轮槐src:'http://www.sencha.com/img/20110215-feat-html5.png',
renderTo:Ext.getBody()
});

//
changingImage.setSrc('http://www.sencha.com/img/20110215-feat-perf.png');

10. extjs怎么使图片上传时显示预览

这个我做过,不难,思路给你 1.是当文本框内容发生改变的时候就将图片上传到服务器(如果图片扰轿小,用户是感觉不到你已经做了上传操作的。) 2.当服务器接受到这个图片的时候,将其放入到一个临时文件夹中并返回给前台一个图片路径(图片流也可以)。 3.Ajax请求会有一个相应,在服务器端成功接受到上传的图片后,返回给Ajax一个Reponse,这个Reponse里包含一个图片路径。 4.ExtJS在前台获取success里的responseText之后(也就是图片路径)将默认图片的src指向从后台反馈回来的图片路径。 现在图片就会现实出来流程是:用户选择图片--> 触发文本框改变事件---> 在事件中通过AJAX将图片上传给服务芹李哪器---> 服务器将图片名称修改为UUID以免重复,并将此图片的路径返回给前台---> 前台AJAX请求的回调函数中获取responseText,也就是图片路径---> 设置默认图片的src为responseText----> 用户重新选择的时候(例如用户不喜欢这张图)---> 在文本框改变事件中通过AJAX将图片上传(包括先前上传的图片名称)---> 后台根据参数先删除临时图片---> 重复以上的步骤直到用户确定 需要注意的问题: 1.当用户改变了图片之后,需要把上一次的临时图片文件删除掉,以免出现垃圾图片过多。 2.每嫌码次上传图片的时候要在后面跟上一个随机参数(因为如果请求路径和参数相同,浏览器不会再继续发送请求)。通常情况下使用new Date()就可以了例如 "uploadImag.do?method=uploadImage&randomParam="+new Date() 3.图片太大的话,效果不是很好。 4.当用户点击确定后,将临时文件里的图片放置到你的正式图片存放目录下即可。