简体   繁体   English

通过从Java Servlet检索一些信息,使用Ajax更新SVG文件

[英]Update SVG file using Ajax, by retrieving some information from a Java Servlet

I have written a Java Servlet that retrieves a SVG image. 我已经编写了一个Java Servlet来检索SVG图像。 The content type for this servlet is CONTENT_TYPE = "image/svg+xml"; 此Servlet的内容类型为CONTENT_TYPE = "image/svg+xml";

This certain servlet is being integrated in a bigger (ADF11g) application as an inlineframe. 这个特定的servlet被作为内联框架集成到一个更大的(ADF11g)应用程序中。 The code should look familiar, if you are accustomed with JSP: 如果您习惯了JSP,则代码应该看起来很熟悉:

    <af:inlineFrame source="servlet?Filename=TestSVG1&amp;width=1024&amp;height=1024"                            
                    inlineStyle="width
                    :#{session.graphSVGWidth}px; height:#{session.graphSVGHeight}px; border: none">
    </af:inlineFrame>

This SVG contains a dyanmic popup that allows the user to interact "with the picture", by sending information to the server via Ajax calls. 该SVG包含一个动态弹出窗口,该弹出窗口允许用户通过Ajax调用向服务器发送信息,从而与图片进行交互。

For example this a part of JavaScript that is being used by the SVG: 例如,这是SVG正在使用的JavaScript的一部分:

function loadXMLDocPOST(params) {
    var xmlhttp = getXmlHttp();
    xmlhttp.open("POST", 'servlet', true);

    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlhttp.setRequestHeader("Content-length", params.length);
    xmlhttp.setRequestHeader("Connection", "close");
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            /* Do something here */   
        }
        else {
            //alert('xmlhttp.status_r2=' + xmlhttp.status);
        }
    }
    xmlhttp.send(params);
}

function editAction(Filename, Name){
    loadXMLDocPOST(...)
}

The Ajax call is successful, but the problem is that after I trigger some actions from the SVG, I want to update the picture contained in the inline frame (the /* Do something here */ ) Ajax调用成功,但是问题是,当我从SVG触发了一些操作之后,我想更新内联框架中包含的图片( /* Do something here */

So, how do I rerender the SVG, from inside the SVG :) ? 那么,如何从SVG内部重新渲染SVG :)? The problem is that innerHTML is not working in SVG. 问题在于innerHTML在SVG中不起作用。 document.write() is not working either. document.write()也不起作用。 So do you have any suggestions ? 那么您有什么建议吗?

you can use parent.XXX to access the global variables and functions of the HTML document which includes that svg. 您可以使用parent.XXX来访问包含该svg的HTML文档的全局变量和函数。

in this way, svg can interact with its contained html document. 这样,svg可以与其包含的html文档进行交互。

for example: 例如:

parent.document.write() 

works in svg! 在svg中工作!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM