Solved

Mozilla browsers don't detect image type for CF templates with jpg or png

Posted on 2004-09-14
8
240 Views
Last Modified: 2013-12-24
This is tricky. Read carefully:

I'm using CFCHART to generate jpg and png images of graphs and pie charts. These images appear on the page correctly but they are not accessible by the user as jpgs or pngs WHEN USING MOZILLA BROWSERS. If you right click on the image, you cannot copy the image. Try the same thing on IE and it works fine.

For other pages of the same app that have static jpg files, the image IS detectable by Mozilla for its correct content-type. The problem for Mozilla is only on the pages where the image is generated by CFCHART.

My guess is that the content-type is set differently when this page is generated by CFCHART and that Mozilla being more by the book is not seeing what it needs to.

Is there a way for me to detect what that content-type setting is for the page?

Here's the CF debug display of some of the related variables - is this a measure of what the server sent to the browser?

CONTENT_TYPE=application/x-www-form-urlencoded
HTTP_ACCEPT=text/xml,application/xml,application/xhtml+xml,text/html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5
HTTP_ACCEPT_ENCODING=gzip,deflate
HTTP_ACCEPT_LANGUAGE=en-us,en;q=0.5
 JSESSIONID=06303064711095181606332
HTTP_USER_AGENT=Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7) Gecko/20040803 Firefox/0.9.3

On the page that is not generated by CFCHART I notice that the CONTENT_TYPE variable is blank. Is that a clue?

0
Comment
Question by:451ls
  • 4
  • 4
8 Comments
 
LVL 35

Expert Comment

by:mrichmon
ID: 12067953
please show the cfchart code you are using

Are you writing to a jpg file first?

If so then it should work.

If not then you may be having interference from the area maps that cfchart generates.
0
 

Author Comment

by:451ls
ID: 12068772
Don't know what you mean by writing to a jpg file first. Cfchart creates and embeds
the image in the cfm template.

In the main template I do this:

<cfset imgtype = "png">
<cfset show3d = "yes">

And in one of many cfincludes I have this: (not showing the query that precedes it)

<cfoutput>
      <tr>
        <th colspan="2">#Evaluate(DE(Title))#</th>
      </tr>
      <tr>
      <td class="left">
      <cfset totalminutes = 0>
      <cfset totalcount = 0>
      <cfloop query="GetResults">
      <cfset totalcount = (totalcount + answercount)>
      <cfset totalminutes = (totalminutes + (answer*answercount))>
      </cfloop>
        <table cellspacing="0">
          <tr><td>Average minutes:</td><td>#round(val(totalminutes/totalcount))#</td></tr>
        </table>
      </td>
      <!--- <td><cfloop query="GetResults">#answer# - #answercount#<br></cfloop></td> --->
      <td class="right">
      <cfchart chartheight="150" chartwidth="230" format="#imgtype#"  pieslicestyle="solid" show3d="#show3d#">
         <cfchartseries type="pie" query="GetResults"
         valuecolumn="answercount" itemcolumn="answer">
         </cfchartseries>
      </cfchart>
      </td>
      </tr>
</cfoutput>
0
 
LVL 35

Expert Comment

by:mrichmon
ID: 12069279
There are 2 ways cfchart works.

1) Dispaly directly to the screen

2) Write to a file and then display the image file to the screen

You are using option 1 and with that option if you look at the html you will notice there is also an area map created.  You may want to see what other javascript is created and if that is interfering.
0
Save the day with this special offer from ATEN!

Save 30% on the CV211 using promo code EXPERTS30 now through April 30th. The ATEN CV211 connects a laptop directly to any server allowing you instant access to perform data maintenance and local operations, for quick troubleshooting, updating, service and repair.

 

Author Comment

by:451ls
ID: 12069987
I see the map command in the source for the page, but that is just a bunch of coordinates.

This line comes after the map and could be the problem:

<IMG SRC="/CFIDE/GraphData.cfm?graphID=Images/100001.PNG" id=Images_100001_PNG name=Images_100001_PNG usemap="#Images_100001_PNG_map" border=0>

I think the problem is that this URL is pointing to a .cfm page with the image as part of the query string.
But why is IE able to detect the image and mozilla browsers not?



0
 

Author Comment

by:451ls
ID: 12070112
And regarding your option 2 approach, would that result in all content on the page, image and text, being one image file? That is not acceptable as the requirement is for MS office users to be able to copy and paste the graph image separately.

nick
0
 
LVL 35

Accepted Solution

by:
mrichmon earned 500 total points
ID: 12070560
no

Just the graph

Here is how you would do that:

<body>
any page content you want here....

<cfchart
                              chartheight="600"
                              chartwidth="750"
                              yaxistitle="Product Count"
                              format="jpg"
                              scalefrom="0"
                              scaleto="300"
                              gridlines="13"
                              name="output_graph">
                              <cfoutput query="PickupTrends" group="PickupDate">
                                    <cfchartseries type="bar" paintstyle="shade" serieslabel="#PickupDate#">
                                          <cfoutput>
                                                <cfchartdata item="#PickupTime#" value="#Quantity#">
                                          </cfoutput>
                                    </cfchartseries>
                              </cfoutput>
                        </cfchart>
                        <cflock name="PickupTrendsGraph" type="exclusive" timeout="10">
                              <cffile
                                    action="write"
                                    charset="ISO-8859-1"
                                    file="#ExpandPath('/images/graphs/PickupTrendsGraph.jpg')#"
                                    output="#output_graph#"
                                    addnewline="yes">
                        </cflock>
                        <cfoutput><img src="/images/graphs/PickupTrendsGraph.jpg" height="600" width="750"></cfoutput>

any more content you want after the graph here....

</body>
0
 
LVL 35

Expert Comment

by:mrichmon
ID: 12070568
It turns out GraphData.cfm is not really a page.

Search your server - it doesn't exist.

It turns out that this is a cold fusion mapping.

Try the above method of writing to a file first and displaying the image - it works more consistently, but you lose the area map.
0
 

Author Comment

by:451ls
ID: 12079399
Awesome.

It took a bit to test it, but it solves the problem. It is as I expected, the GraphData.cfm, while not a file, does get treated by the browser as if it were a file and thus does not allow "Copy image" on the properties. By creating the image file using the name property of CFCHART it creates a REAL image and thus can be copied.

Thanks again.
 
0

Featured Post

Ransomware-A Revenue Bonanza for Service Providers

Ransomware – malware that gets on your customers’ computers, encrypts their data, and extorts a hefty ransom for the decryption keys – is a surging new threat.  The purpose of this eBook is to educate the reader about ransomware attacks.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How to move and access a folder outside of the root folder 4 110
Web server settings related to keepalive 1 130
Connect to MS-SQL server from Linux/PHP 8 96
Linux Hosting 16 76
A web service (http://en.wikipedia.org/wiki/Web_service) is a software related technology that facilitates machine-to-machine interaction over a network. This article helps beginners in creating and consuming a web service using the ColdFusion Ma…
One of the typical problems I have experienced is when you have to move a web server from one hosting site to another. You normally prepare all on the new host, transfer the site, change DNS and cross your fingers hoping all will be ok on new server…
A short tutorial showing how to set up an email signature in Outlook on the Web (previously known as OWA). For free email signatures designs, visit https://www.mail-signatures.com/articles/signature-templates/?sts=6651 If you want to manage em…
Finds all prime numbers in a range requested and places them in a public primes() array. I've demostrated a template size of 30 (2 * 3 * 5) but larger templates can be built such 210  (2 * 3 * 5 * 7) or 2310  (2 * 3 * 5 * 7 * 11). The larger templa…

756 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question