如何在Rails中使用生成的图像更新占位符的内容？

I have a div tag in the view that I'd like to update with a graph that I generate via Gruff.

我在视图中有一个div标签,我想用我通过Gruff生成的图表进行更新。

I have the following controller action which does this at the end

我有以下控制器动作,最后这样做

send_data g.to_blob, :disposition=>'inline', :type=>'image/png', :filename=>'top_n.pdf'

Now if I directly invoke this action, I can see the graph. (More details here if reqd.)

现在,如果我直接调用此操作,我可以看到图形。 (如果需要,请在此处详细说明。)

If I add a link_to_remote_tag that calls the above action via AJAX passing in specific input, generates this graph and tries to update a placeholder div tag... I see gibberish.

如果我添加一个link_to_remote_tag,通过传递特定输入的AJAX调用上述操作,生成此图并尝试更新占位符div标签...我看到了乱码。

I think I can write the graph to a png file with g.write(filename.png) how do I embed the graph within the div tag in the view at run-time?

我想我可以用g.write(filename.png)将图形写入png文件中如何在运行时将图形嵌入到视图中的div标签中?

2 个解决方案

#1

In your link_to_remote tag just set :complete to something like this:

在你的link_to_remote标签中,只需设置:完成如下:

:complete => "updateImg(id_of_div, request.responseText)"

And write a JS function:

并编写一个JS函数:

function updateImg(id, img)
{
  $(id).innerHTML = '<img src="' + img + '" />';
}

Where id_of_div is the id of the div when you want to show de image.

其中id_of_div是您想要显示图像时div的id。

The request.responseText var come from the request of the AJAX call, I mean, when your code writes the png file with the graph, finish the method returning the path to this new png (render :text => path_to_new_image ); then, use this request variable in the :complete.

request.responseText var来自AJAX调用的请求,我的意思是,当你的代码用图形写png文件时,完成返回这个新png的路径的方法(render:text => path_to_new_image);然后,在:complete中使用此请求变量。

#2

You could use a regular img tag to call a controller action wich returns a generated png. If you set up the controller to use respond_to something like this:

您可以使用常规img标记来调用控制器操作,该操作将返回生成的png。如果你设置控制器使用respond_to这样的东西:

def graph
    # get the relevant data for 'g' here
    respond_to do |format|
        format.html #uses the default view if relevant (good for debugging)
        format.png do 
            send_data g.to_blob, 
                :disposition=>'inline', 
                :type=>'image/png', 
                :filename=>'top_n.pdf' 
        end
    end
end

You'll even have a normal looking url for the generator like this:

你甚至可以为这个生成器提供一个正常的url:

<img src="controller/graph.png" alt="Something"/>

If there's a chance the image generation can fail: you could store a fallback image on the server and read that file and return that.

如果图像生成有可能失败:您可以在服务器上存储一个后备图像并读取该文件并返回该文件。

If the generation is quite heavy and not very likely to change all the time you cold allso cache the resulting file and get that instead if you determine that the data has not changed. You could use the method ARemesal suggested to delay adding the image link until the image is generated and then link directly to the cached file. (It depends on your specific case what's best)

如果生成非常繁重并且不太可能一直改变,那么冷却所有缓存生成的文件并在确定数据未更改时获取该文件。您可以使用ARemesal建议的方法来延迟添加图像链接,直到生成图像,然后直接链接到缓存文件。 (这取决于你的具体情况什么是最好的)

#1