Canvas's width to big to draw
The group you are posting to is a
Usenet group . Messages posted to this group will make your email address visible to anyone on the Internet.
Your reply message has not been sent.
Your post was successful
From:
Samuel Wei <sams... @gmail.com>
Date: Thu, 19 Mar 2009 05:19:30 -0700 (PDT)
Local: Thurs, Mar 19 2009 8:19 am
Subject: Canvas's width to big to draw
<html>
<head>
<title>A canvas example</title>
<script type="text/javascript">
function draw() {
var ctx = document.getElementById('cv').getContext('2d');
ctx.fillStyle = 'Black';
ctx.fillRect(0, 0, 34560, 100);
}
</script>
</head>
<body onload="draw();">
<div width="34560px" height="460px" style="border:1px solid
#CCCCCC;overflow:auto">
<canvas id="cv" width="34560px" height="460px"></canvas>
</div>
</body>
</html>
Anyone know how to resolve this problem?
Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Fabien <phenxdes... @gmail.com>
Date: Thu, 19 Mar 2009 05:32:15 -0700 (PDT)
Local: Thurs, Mar 19 2009 8:32 am
Subject: Re: Canvas's width to big to draw
Hello, what is your problem ?
And why would you need to draw such a rectangle ?
On Mar 19, 1:19 pm, Samuel Wei <sams... @gmail.com> wrote:
> <html>
> <head>
> <title>A canvas example</title>
> <script type="text/javascript">
> function draw() {
> var ctx = document.getElementById('cv').getContext('2d');
> ctx.fillStyle = 'Black';
> ctx.fillRect(0, 0, 34560, 100);
> }
> </script>
> </head>
> <body onload="draw();">
> <div width="34560px" height="460px" style="border:1px solid
> #CCCCCC;overflow:auto">
> <canvas id="cv" width="34560px" height="460px"></canvas>
> </div>
> </body>
> </html>
> Anyone know how to resolve this problem?
> Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Kuba Caban <kuba.iluva... @gmail.com>
Date: Thu, 19 Mar 2009 13:33:45 +0100
Local: Thurs, Mar 19 2009 8:33 am
Subject: Re: Canvas's width to big to draw
Try:
<canvas id="cv" width="34560" height="460"></canvas>
Those "pxs" here shouldn't take place.
2009/3/19 Samuel Wei <sams... @gmail.com>
> <html>
> <head>
> <title>A canvas example</title>
> <script type="text/javascript">
> function draw() {
> var ctx = document.getElementById('cv').getContext('2d');
> ctx.fillStyle = 'Black';
> ctx.fillRect(0, 0, 34560, 100);
> }
> </script>
> </head>
> <body onload="draw();">
> <div width="34560px" height="460px" style="border:1px solid
> #CCCCCC;overflow:auto">
> <canvas id="cv" width="34560px" height="460px"></canvas>
> </div>
> </body>
> </html>
> Anyone know how to resolve this problem?
> Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Samuel Wei <sams... @gmail.com>
Date: Thu, 19 Mar 2009 05:53:04 -0700 (PDT)
Local: Thurs, Mar 19 2009 8:53 am
Subject: Re: Canvas's width to big to draw
It doesn't work either...
I try to draw Gantt Chart using Canvas.
On Mar 19, 8:33 pm, Kuba Caban <kuba.iluva... @gmail.com> wrote:
> Try:
> <canvas id="cv" width="34560" height="460"></canvas>
> Those "pxs" here shouldn't take place.
> 2009/3/19 Samuel Wei <sams... @gmail.com>
> > <html>
> > <head>
> > <title>A canvas example</title>
> > <script type="text/javascript">
> > function draw() {
> > var ctx = document.getElementById('cv').getContext('2d');
> > ctx.fillStyle = 'Black';
> > ctx.fillRect(0, 0, 34560, 100);
> > }
> > </script>
> > </head>
> > <body onload="draw();">
> > <div width="34560px" height="460px" style="border:1px solid
> > #CCCCCC;overflow:auto">
> > <canvas id="cv" width="34560px" height="460px"></canvas>
> > </div>
> > </body>
> > </html>
> > Anyone know how to resolve this problem?
> > Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Fabien <phenxdes... @gmail.com>
Date: Thu, 19 Mar 2009 06:09:32 -0700 (PDT)
Local: Thurs, Mar 19 2009 9:09 am
Subject: Re: Canvas's width to big to draw
The max height or width for a canvas seems to be 32768 (which I
thought was enough).
This works :
{{{
<html>
<head>
<title>A canvas example</title>
<script type="text/javascript" src="excanvas.js"></script>
<script type="text/javascript">
function draw() {
var ctx = document.getElementById('cv').getContext('2d');
ctx.fillStyle = 'black';
ctx.fillRect(0, 0, 32768, 100);
}
</script>
</head>
<body onload="draw();">
<div style="border:1px solid #CCCCCC;overflow:auto; width:32768px;
height:460px;">
<canvas id="cv" style="width:32768px; height:460px;"></canvas>
</div>
</body>
}}}
You need to use a correct HTML/CSS syntax in order to make it work.
On Mar 19, 1:53 pm, Samuel Wei <sams... @gmail.com> wrote:
> It doesn't work either...
> I try to draw Gantt Chart using Canvas.
> On Mar 19, 8:33 pm, Kuba Caban <kuba.iluva... @gmail.com> wrote:
> > Try:
> > <canvas id="cv" width="34560" height="460"></canvas>
> > Those "pxs" here shouldn't take place.
> > 2009/3/19 Samuel Wei <sams... @gmail.com>
> > > <html>
> > > <head>
> > > <title>A canvas example</title>
> > > <script type="text/javascript">
> > > function draw() {
> > > var ctx = document.getElementById('cv').getContext('2d');
> > > ctx.fillStyle = 'Black';
> > > ctx.fillRect(0, 0, 34560, 100);
> > > }
> > > </script>
> > > </head>
> > > <body onload="draw();">
> > > <div width="34560px" height="460px" style="border:1px solid
> > > #CCCCCC;overflow:auto">
> > > <canvas id="cv" width="34560px" height="460px"></canvas>
> > > </div>
> > > </body>
> > > </html>
> > > Anyone know how to resolve this problem?
> > > Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Samuel Wei <sams... @gmail.com>
Date: Thu, 19 Mar 2009 07:02:23 -0700 (PDT)
Local: Thurs, Mar 19 2009 10:02 am
Subject: Re: Canvas's width to big to draw
Yes, it works . Thank you very much.
On Mar 19, 9:09 pm, Fabien <phenxdes... @gmail.com> wrote:
> The max height or width for a canvas seems to be 32768 (which I
> thought was enough).
> This works :
> {{{
> <html>
> <head>
> <title>A canvas example</title>
> <script type="text/javascript" src="excanvas.js"></script>
> <script type="text/javascript">
> function draw() {
> var ctx = document.getElementById('cv').getContext('2d');
> ctx.fillStyle = 'black';
> ctx.fillRect(0, 0, 32768, 100);
> }
> </script>
> </head>
> <body onload="draw();">
> <div style="border:1px solid #CCCCCC;overflow:auto; width:32768px;
> height:460px;">
> <canvas id="cv" style="width:32768px; height:460px;"></canvas>
> </div>
> </body>
> }}}
> You need to use a correct HTML/CSS syntax in order to make it work.
> On Mar 19, 1:53 pm, Samuel Wei <sams... @gmail.com> wrote:
> > It doesn't work either...
> > I try to draw Gantt Chart using Canvas.
> > On Mar 19, 8:33 pm, Kuba Caban <kuba.iluva... @gmail.com> wrote:
> > > Try:
> > > <canvas id="cv" width="34560" height="460"></canvas>
> > > Those "pxs" here shouldn't take place.
> > > 2009/3/19 Samuel Wei <sams... @gmail.com>
> > > > <html>
> > > > <head>
> > > > <title>A canvas example</title>
> > > > <script type="text/javascript">
> > > > function draw() {
> > > > var ctx = document.getElementById('cv').getContext('2d');
> > > > ctx.fillStyle = 'Black';
> > > > ctx.fillRect(0, 0, 34560, 100);
> > > > }
> > > > </script>
> > > > </head>
> > > > <body onload="draw();">
> > > > <div width="34560px" height="460px" style="border:1px solid
> > > > #CCCCCC;overflow:auto">
> > > > <canvas id="cv" width="34560px" height="460px"></canvas>
> > > > </div>
> > > > </body>
> > > > </html>
> > > > Anyone know how to resolve this problem?
> > > > Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Samuel Wei <sams... @gmail.com>
Date: Thu, 19 Mar 2009 07:29:36 -0700 (PDT)
Local: Thurs, Mar 19 2009 10:29 am
Subject: Re: Canvas's width to big to draw
If I using HTML/CSS to set the height and width for Canvas element,
another problem raised: as the following code, I want to draw a
rectangle with height & width = 20px, but the graphics is much more
bigger than what I want to draw. anyone knows what be happened?
<html>
<head>
<title>A canvas example</title>
<script type="text/javascript">
function draw() {
var ctx = document.getElementById('cv').getContext('2d');
ctx.fillStyle = 'black';
ctx.fillRect(0, 0, 20, 20);
}
</script>
</head>
<body onload="draw();">
<div style="border:1px solid #CCCCCC;width:32768px;height:
460px;overflow:auto">
<canvas id="cv" style="width:32768px;height:460px"></canvas>
</div>
</body>
</html>
On Mar 19, 10:02 pm, Samuel Wei <sams... @gmail.com> wrote:
> Yes, it works . Thank you very much.
> On Mar 19, 9:09 pm, Fabien <phenxdes... @gmail.com> wrote:
> > The max height or width for a canvas seems to be 32768 (which I
> > thought was enough).
> > This works :
> > {{{
> > <html>
> > <head>
> > <title>A canvas example</title>
> > <script type="text/javascript" src="excanvas.js"></script>
> > <script type="text/javascript">
> > function draw() {
> > var ctx = document.getElementById('cv').getContext('2d');
> > ctx.fillStyle = 'black';
> > ctx.fillRect(0, 0, 32768, 100);
> > }
> > </script>
> > </head>
> > <body onload="draw();">
> > <div style="border:1px solid #CCCCCC;overflow:auto; width:32768px;
> > height:460px;">
> > <canvas id="cv" style="width:32768px; height:460px;"></canvas>
> > </div>
> > </body>
> > }}}
> > You need to use a correct HTML/CSS syntax in order to make it work.
> > On Mar 19, 1:53 pm, Samuel Wei <sams... @gmail.com> wrote:
> > > It doesn't work either...
> > > I try to draw Gantt Chart using Canvas.
> > > On Mar 19, 8:33 pm, Kuba Caban <kuba.iluva... @gmail.com> wrote:
> > > > Try:
> > > > <canvas id="cv" width="34560" height="460"></canvas>
> > > > Those "pxs" here shouldn't take place.
> > > > 2009/3/19 Samuel Wei <sams... @gmail.com>
> > > > > <html>
> > > > > <head>
> > > > > <title>A canvas example</title>
> > > > > <script type="text/javascript">
> > > > > function draw() {
> > > > > var ctx = document.getElementById('cv').getContext('2d');
> > > > > ctx.fillStyle = 'Black';
> > > > > ctx.fillRect(0, 0, 34560, 100);
> > > > > }
> > > > > </script>
> > > > > </head>
> > > > > <body onload="draw();">
> > > > > <div width="34560px" height="460px" style="border:1px solid
> > > > > #CCCCCC;overflow:auto">
> > > > > <canvas id="cv" width="34560px" height="460px"></canvas>
> > > > > </div>
> > > > > </body>
> > > > > </html>
> > > > > Anyone know how to resolve this problem?
> > > > > Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Kuba Caban <kuba.iluva... @gmail.com>
Date: Thu, 19 Mar 2009 15:31:24 +0100
Local: Thurs, Mar 19 2009 10:31 am
Subject: Re: Canvas's width to big to draw
As Far As I Know you need to specify canvas element dismensions via HTML in
addition to CSSed ones:
<canvas id="cv" width="32768" height="460" style="width:32768px;height:
460px"></canvas>
2009/3/19 Samuel Wei <sams... @gmail.com>
> If I using HTML/CSS to set the height and width for Canvas element,
> another problem raised: as the following code, I want to draw a
> rectangle with height & width = 20px, but the graphics is much more
> bigger than what I want to draw. anyone knows what be happened?
> <html>
> <head>
> <title>A canvas example</title>
> <script type="text/javascript">
> function draw() {
> var ctx = document.getElementById('cv').getContext('2d');
> ctx.fillStyle = 'black';
> ctx.fillRect(0, 0, 20, 20);
> }
> </script>
> </head>
> <body onload="draw();">
> <div style="border:1px solid #CCCCCC;width:32768px;height:
> 460px;overflow:auto">
> <canvas id="cv" style="width:32768px;height:460px"></canvas>
> </div>
> </body>
> </html>
> On Mar 19, 10:02 pm, Samuel Wei <sams... @gmail.com> wrote:
> > Yes, it works . Thank you very much.
> > On Mar 19, 9:09 pm, Fabien <phenxdes... @gmail.com> wrote:
> > > The max height or width for a canvas seems to be 32768 (which I
> > > thought was enough).
> > > This works :
> > > {{{
> > > <html>
> > > <head>
> > > <title>A canvas example</title>
> > > <script type="text/javascript" src="excanvas.js"></script>
> > > <script type="text/javascript">
> > > function draw() {
> > > var ctx = document.getElementById('cv').getContext('2d');
> > > ctx.fillStyle = 'black';
> > > ctx.fillRect(0, 0, 32768, 100);
> > > }
> > > </script>
> > > </head>
> > > <body onload="draw();">
> > > <div style="border:1px solid #CCCCCC;overflow:auto; width:32768px;
> > > height:460px;">
> > > <canvas id="cv" style="width:32768px; height:460px;"></canvas>
> > > </div>
> > > </body>
> > > }}}
> > > You need to use a correct HTML/CSS syntax in order to make it work.
> > > On Mar 19, 1:53 pm, Samuel Wei <sams... @gmail.com> wrote:
> > > > It doesn't work either...
> > > > I try to draw Gantt Chart using Canvas.
> > > > On Mar 19, 8:33 pm, Kuba Caban <kuba.iluva... @gmail.com> wrote:
> > > > > Try:
> > > > > <canvas id="cv" width="34560" height="460"></canvas>
> > > > > Those "pxs" here shouldn't take place.
> > > > > 2009/3/19 Samuel Wei <sams... @gmail.com>
> > > > > > <html>
> > > > > > <head>
> > > > > > <title>A canvas example</title>
> > > > > > <script type="text/javascript">
> > > > > > function draw() {
> > > > > > var ctx =
> document.getElementById('cv').getContext('2d');
> > > > > > ctx.fillStyle = 'Black';
> > > > > > ctx.fillRect(0, 0, 34560, 100);
> > > > > > }
> > > > > > </script>
> > > > > > </head>
> > > > > > <body onload="draw();">
> > > > > > <div width="34560px" height="460px" style="border:1px solid
> > > > > > #CCCCCC;overflow:auto">
> > > > > > <canvas id="cv" width="34560px" height="460px"></canvas>
> > > > > > </div>
> > > > > > </body>
> > > > > > </html>
> > > > > > Anyone know how to resolve this problem?
> > > > > > Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Samuel Wei <sams... @gmail.com>
Date: Fri, 20 Mar 2009 06:41:19 -0700 (PDT)
Local: Fri, Mar 20 2009 9:41 am
Subject: Re: Canvas's width to big to draw
I already specified width and height for the Canvas element, it does't
work.
On Mar 19, 10:31 pm, Kuba Caban <kuba.iluva... @gmail.com> wrote:
> As Far As I Know you need to specify canvas element dismensions via HTML in
> addition to CSSed ones:
> <canvas id="cv" width="32768" height="460" style="width:32768px;height:
> 460px"></canvas>
> 2009/3/19 Samuel Wei <sams... @gmail.com>
> > If I using HTML/CSS to set the height and width for Canvas element,
> > another problem raised: as the following code, I want to draw a
> > rectangle with height & width = 20px, but the graphics is much more
> > bigger than what I want to draw. anyone knows what be happened?
> > <html>
> > <head>
> > <title>A canvas example</title>
> > <script type="text/javascript">
> > function draw() {
> > var ctx = document.getElementById('cv').getContext('2d');
> > ctx.fillStyle = 'black';
> > ctx.fillRect(0, 0, 20, 20);
> > }
> > </script>
> > </head>
> > <body onload="draw();">
> > <div style="border:1px solid #CCCCCC;width:32768px;height:
> > 460px;overflow:auto">
> > <canvas id="cv" style="width:32768px;height:460px"></canvas>
> > </div>
> > </body>
> > </html>
> > On Mar 19, 10:02 pm, Samuel Wei <sams... @gmail.com> wrote:
> > > Yes, it works . Thank you very much.
> > > On Mar 19, 9:09 pm, Fabien <phenxdes... @gmail.com> wrote:
> > > > The max height or width for a canvas seems to be 32768 (which I
> > > > thought was enough).
> > > > This works :
> > > > {{{
> > > > <html>
> > > > <head>
> > > > <title>A canvas example</title>
> > > > <script type="text/javascript" src="excanvas.js"></script>
> > > > <script type="text/javascript">
> > > > function draw() {
> > > > var ctx = document.getElementById('cv').getContext('2d');
> > > > ctx.fillStyle = 'black';
> > > > ctx.fillRect(0, 0, 32768, 100);
> > > > }
> > > > </script>
> > > > </head>
> > > > <body onload="draw();">
> > > > <div style="border:1px solid #CCCCCC;overflow:auto; width:32768px;
> > > > height:460px;">
> > > > <canvas id="cv" style="width:32768px; height:460px;"></canvas>
> > > > </div>
> > > > </body>
> > > > }}}
> > > > You need to use a correct HTML/CSS syntax in order to make it work.
> > > > On Mar 19, 1:53 pm, Samuel Wei <sams... @gmail.com> wrote:
> > > > > It doesn't work either...
> > > > > I try to draw Gantt Chart using Canvas.
> > > > > On Mar 19, 8:33 pm, Kuba Caban <kuba.iluva... @gmail.com> wrote:
> > > > > > Try:
> > > > > > <canvas id="cv" width="34560" height="460"></canvas>
> > > > > > Those "pxs" here shouldn't take place.
> > > > > > 2009/3/19 Samuel Wei <sams... @gmail.com>
> > > > > > > <html>
> > > > > > > <head>
> > > > > > > <title>A canvas example</title>
> > > > > > > <script type="text/javascript">
> > > > > > > function draw() {
> > > > > > > var ctx =
> > document.getElementById('cv').getContext('2d');
> > > > > > > ctx.fillStyle = 'Black';
> > > > > > > ctx.fillRect(0, 0, 34560, 100);
> > > > > > > }
> > > > > > > </script>
> > > > > > > </head>
> > > > > > > <body onload="draw();">
> > > > > > > <div width="34560px" height="460px" style="border:1px solid
> > > > > > > #CCCCCC;overflow:auto">
> > > > > > > <canvas id="cv" width="34560px" height="460px"></canvas>
> > > > > > > </div>
> > > > > > > </body>
> > > > > > > </html>
> > > > > > > Anyone know how to resolve this problem?
> > > > > > > Thanks in advance!
You must
Sign in before you can post messages.
You do not have the permission required to post.
From:
Fabien <phenxdes... @gmail.com>
Date: Fri, 20 Mar 2009 06:53:35 -0700 (PDT)
Local: Fri, Mar 20 2009 9:53 am
Subject: Re: Canvas's width to big to draw
As weird as it is, the HTML properties "width" and "height" don't seem
to support support values more than 32767 (16bits/2 - 1).
This works :
<canvas id="cv" width="32767" height="150"></canvas>
And the rectangle will be really 20*20px. It seems the style attribute
will resize the canvas after the rectangle is drawn, so it is resized
too.
You must
Sign in before you can post messages.
You do not have the permission required to post.