Hi,
We are having a problem with dynamic resizing of the GoDiagram. The problem is as follows. Based on the client having a variety of different display resolutions, we can’t have a one size diagram that fits all. We have a GoView in a Cell, what we need is the GoView to occupy 100% of the table cells width.
We have tried getting the values of the width in pixels, via JScript (not possible as it is clientside and the image is already gathered), we have tried converting the width of the cell from % to px but that too is impossible on the server.
Is there anyway we can say we want the image to be 100% rather than 100px.
Regards,
Paul Kinlan
Can you change the width and height in JavaScript code on the client?
I don’t see any way of specifying what you want in the rendered tag produced by a GoView. GoView currently requires its Width and Height to be pixels.
We have tried to develop Java Script solution however there does not seem to be a way of passing the data to the GoView because the GoView (we think) is contsucted on the server before any java script is run on the client.
If the table cell that we embed the GoDiagram in has a pixel width rather than a % width then we don’t think it will be a problem to get the values and then set the width and height properties of the GoView accordingly.
We have been thinking about possibly, if we can, subclassing a GoView (I have never done this sucessfully, so I cant do it - If anyone has an example of a subclassed GoView I would be very grateful to see how it is done), overriding the RenderTag to emit the width and height information that might be passed to a GoWebImage, however this still doesn’t get over the fact that we can’t easily get the information back to the server.
The only other option we can see is to allow the users to configure the viewable area of the diagram for each resolution they will use and bring that back at runtime.
Regards,
Paul
ps If anyone can suggest anything further I am all ears :)
Kinlan,
I’ve had the same issue with my browsers and all i’ve been able to come up with, client side, is some javascript that will resize the image for me. The only problem with this that i’ve run into is resolution… if you resize the image to something larger, you’re going to lose resolution and the image becomes pixilated… here’s what i’ve done:
Note: onPageLoad=‘goResizeView()’
In my webform, this resizes the image. I have not toyed with changing the image format from PNG to GIF or JPG… perhaps this would resolve the image resolution??
One more thing, when you do this, you’ll have to override the existing function goSearchArray (e,a,def){…} and take into account the x and y resize factors to locate the nodes within the image since you’re not changing the arrays which describe the image to the JS built by Go.
This has worked for me, however, I leave the resize option up to the user to choose whether they want to resize and lose resolution.
I would also like to find a way to determine the H & W properties at runtime so i don’t have to fiddle with JS and don’t lose resolution… of course, if the user resizes the window, the image would have to be regenerated, or deal with scrollbars (eek!)
Bob
You can explicitly cause a GoView to resize from JavaScript–just call the goResize function, which takes a delta width and a delta height:
Expand Window
Hi guys,
I will try both of those solutions in our next build. Thanks for your comments.
We are assuming here ar the moment, that the RenderTag of the GoView renders the Table and image tags, before the browser goes off and gets the image, which is then computed, drawn and output. It might be possible if we subclass GoView and GoWebImage. GoView emits some java script that that appends the width and height to the IMG SRC=“xxxx.aspx?WIDTH=1&HEIGHT=1”, now the GoWebImage can pick up on this and perform the modification to the Image.
There is a period of time which we can hijack which can create the image parameters before the browser requests the image from the server.
Would this be feasible? I don’t really want to do this as I have tried creating a subclass of GoView and I can’t get them to work on my screen without it saying that my new View is not a GoView :(
Regards and thanks for your help,
Paul
Hi Guys,
I have a solution that fills the entire window or table cell etc when the image is first loaded.
The process is as follows: Subclass GoView, and GoWebImage.
GoView: Ensure that it can’t render any data, then emit some special JS code which creates the tag.
When the page is loaded call the JS function OutputSize, this then essentially creates the HTML IMG control that would normally be created by the GoView control adding more “command line” parameters specifying the height and width of the image.
This uses goWeb2.2.1 as it makes use of MakeSessionViewID().
GoWebControl: OnLoad, parse any of the query string parameters such as the width and height. Get the correct session view and update its dimension. Let the OnLoad continue.
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
using System.Collections;
using Northwoods.GoWeb;
namespace GoViewSubclass
{
///
/// Summary description for WebCustomControl1.
///
[DefaultProperty(“New View Control”),
ToolboxData(“<{0}:NewGoView runat=server></{0}:NewGoView>”)]
[Serializable]
public class NewGoView : GoView
{
private string _title;
[Bindable(true),
Category(“Appearance”),
DefaultValue(“”)]
public string Title
{
get
{
return _title;
}
set
{
_title = value;
}
}
///
/// Render this control to the output parameter specified.
///
/// The HTML writer to write out to
protected override void OnLoad(EventArgs evt)
{
base.OnLoad(evt);
// Form the script that is to be registered at client side. Generate the <IMG src= …aspx&goview etc with the width properties of the table cell.
String scriptString = “ function OutputSize() {\n”;
scriptString += “var width=document.getElementById("MCLContainer").offsetWidth; \n” ;
scriptString +=“var height=document.getElementById("MCLContainer").offsetHeigh t ;\n”;//* 3/4;\n";
scriptString +=“var innerstring = document.getElementById("MCLContainer").innerHTML;\n”;
scriptString +=“innerstring="<IMG SRC=\"MCLView.aspx?GoView=” + this.MakeSessionViewID() + "&width="+ width +"&height="+height+ "\" name=\"Viewer1\" width=\"" + width + "\" height=\""+height+ "\" ";
scriptString += “onMouseDown=\"goMouseDown(event,‘Viewer1’)\" onMouseUp=\"goMouseUp(event,‘Viewer1’)\" onDblClick=\"goDblClick(event,‘Viewer1’)\" onMouseMove=\"goMouseMove(event, go_csa_Viewer1, go_ttsa_Viewer1, ‘’)\" onContextMenu=\"return false\" galleryimg=\"no\" onLoad=\"goInit(‘Viewer1’,‘Viewer1’,'” + this.MakeSessionViewID() + “‘,false,‘MCLView.aspx’,’')\">";\n”;
scriptString +=“document.getElementById("MCLContainer").innerHTML=inner string;}<”;
scriptString += “/”;
scriptString += “script>”;
if(!this.Page.IsClientScriptBlockRegistered(“clientScript”))
this.Page.RegisterClientScriptBlock(“clientScript”, scriptString);
this.Page.GetPostBackEventReference(this);
}
protected override void Render(HtmlTextWriter writer)
{
//SO we don’t have the image load twice
//base.Render (writer);
}
}
public class NewWebImage: Northwoods.GoWeb.GoWebImage
{
public NewWebImage()
{
}
protected override void OnLoad(EventArgs e)
{
int width = (int)Convert.ToSingle(Request[“width”]);
int height = (int) Convert.ToSingle(Request[“height”]);
NewGoView m1;
try
{
//Obtain the height and width parameters and change the goView image dimensions
m1=(NewGoView)this.FindSessionView(Request[“GoView”]);
m1.Width=width;
m1.Height=height;
}
catch(Exception ex)
{
string s1= ex.Message;
}
base.OnLoad (e);
}}
}
I followed Walters suggestion of using the goResize and it works great except for the view box in the GoOverview. Once I double click in the GoOverview, the box fixes itself but I was wondering if there was something I could do to update it after using goResize. Thanks.
I haven’t tried this, but you could try calling goReload. You’ll need to look at the code carefully to make sure about this.