我创建了一个 Ext.TreePanel 并且我会在节点中有一个图像,在节点的文本中我有图像的 url 但我无法在页面中加载它,我只看到文本,那里是否可以查看图像?
这是我的代码
var root1 = new Tree.AsyncTreeNode({
text: 'Legenda degli starti PAT',
draggable:true, // disable root node dragging
id:'source'
});
var tree1 = new Tree.TreePanel({
renderTo : 'legend',
animate:true,
loader: new Tree.TreeLoader({dataUrl:'legend.php'}),
containerScroll: true,
root: root1,
});
这是 TreePanel 请求的响应
[{"text":"comuni","id":"co","leaf":false,"cls":"folder","children":[{"text":"http:\/\/localhost\
/cgi-bin\/mapserv?map=\/home\/gis\/mapserver\/cartocomune_wms.map&SERVICE=wms&FORMAT=png&VERSION=1.1
.1&LAYER=comuni&REQUEST=GetLegendGraphic","id":"comuni","leaf":true,"cls":"file"}]},{"text":"idrografia"
,"id":"id","leaf":false,"cls":"folder","children":[{"text":"http:\/\/localhost\/cgi-bin\/mapserv
?map=\/home\/gis\/mapserver\/cartocomune_wms.map&SERVICE=wms&FORMAT=png&VERSION=1.1.1&LAYER=idrografia
&REQUEST=GetLegendGraphic","id":"idrografia","leaf":true,"cls":"file"}]},{"text":"viabilita","id":"via"
,"leaf":false,"cls":"folder","children":[{"text":"http:\/\/localhost\/cgi-bin\/mapserv?map=\/home
\/gis\/mapserver\/cartocomune_wms.map&SERVICE=wms&FORMAT=png&VERSION=1.1.1&LAYER=viabilita&REQUEST=GetLegendGraphic"
,"id":"viabilita","leaf":true,"cls":"file"}]},{"text":"uso_suolo","id":"uso","leaf":false,"cls":"folder"
,"children":[{"text":"http:\/\/localhost\/cgi-bin\/mapserv?map=\/home\/gis\/mapserver\/cartocomune_wms
.map&SERVICE=wms&FORMAT=png&VERSION=1.1.1&LAYER=uso_suolo&REQUEST=GetLegendGraphic","id":"uso_suolo"
,"leaf":true,"cls":"file"}]},{"text":"catasto","id":"cat","leaf":false,"cls":"folder","children":[{"text"
:"http:\/\/localhost\/cgi-bin\/mapserv?map=\/home\/gis\/mapserver\/cartocomune_wms.map&SERVICE=wms
&FORMAT=png&VERSION=1.1.1&LAYER=catasto&REQUEST=GetLegendGraphic","id":"catasto","leaf":true,"cls":"file"
}]}]
谢谢 卢卡
最佳答案
您需要在 JSON 中为节点包含一个“iconCls”属性,该属性引用一个 CSS 类,该类定义了您希望为该特定节点显示的图像。
根据 extjs.com 上的 API 文档:
//在类的配置中指定属性: ... iconCls: '我的图标'
//指定要用作图标图像的背景图像的 css 类: .my-icon { background-image: url(../images/my-icon.gif) 0 6px no-repeat !important;
因此您的 JSON 将如下所示:
[{"text":"comuni","id":"co","leaf":false,"cls":"folder","children":[{"text":"http://本地主机\ /cgi-bin/mapserv?map=/home/gis/mapserver/cartocomune_wms.map&SERVICE=wms&FORMAT=png&VERSION=1.1 .1&LAYER=comuni&REQUEST=GetLegendGraphic","id":"comuni","leaf":true,"cls":"file", "iconCls": "my-icon"}]}, {“文本”:“idrografia” ,"id":"id","leaf":false,"cls":"folder", "iconCls": "my-icon"} ...等等...等等... }]
关于javascript - extjs 在 TreePanel 中加载图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1118958/