Page Menu
Home
Code
Search
Configure Global Search
Log In
Files
F947283
test_chart2d_updating.html
No One
Temporary
Actions
Download File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Flag For Later
Size
2 KB
Subscribers
None
test_chart2d_updating.html
View Options
<
html
>
<
head
>
<
title
>
Chart 2D
</
title
>
<
meta
http-equiv
=
"Content-Type"
content
=
"text/html; charset=utf-8"
/>
<
style
type
=
"text/css"
>
@
import
"../../../dojo/resources/dojo.css"
;
@
import
"../../../dijit/tests/css/dijitTests.css"
;
</
style
>
<!--
The next line should include Microsoft's Silverligth.js, if you plan to use the silverlight backend
<script type="text/javascript" src="Silverlight.js"></script>
-->
<
script
type
=
"text/javascript"
src
=
"../../../dojo/dojo.js"
djConfig
=
"isDebug: true"
></
script
>
<
script
type
=
"text/javascript"
src
=
"../../lang/functional.js"
></
script
>
<
script
type
=
"text/javascript"
src
=
"../Theme.js"
></
script
>
<
script
type
=
"text/javascript"
src
=
"../scaler.js"
></
script
>
<
script
type
=
"text/javascript"
src
=
"../Chart2D.js"
></
script
>
<
script
type
=
"text/javascript"
>
dojo
.
require
(
"dojox.charting.Chart2D"
);
dojo
.
require
(
"dojox.charting.themes.PlotKit.orange"
);
var
chart
,
limit
=
10
,
magnitude
=
30
;
var
randomValue
=
function
(){
return
Math
.
random
()
*
magnitude
;
};
var
makeSeries
=
function
(
len
){
var
s
=
[];
do
{
s
.
push
(
randomValue
());
}
while
(
s
.
length
<
len
);
return
s
;
};
var
seriesA
=
makeSeries
(
limit
),
seriesB
=
makeSeries
(
limit
),
seriesC
=
makeSeries
(
limit
);
var
makeObjects
=
function
(){
chart
=
new
dojox
.
charting
.
Chart2D
(
"test"
);
chart
.
setTheme
(
dojox
.
charting
.
themes
.
PlotKit
.
orange
);
chart
.
addAxis
(
"x"
,
{
fixLower
:
"minor"
,
natural
:
true
,
min
:
1
,
max
:
limit
});
chart
.
addAxis
(
"y"
,
{
vertical
:
true
,
min
:
0
,
max
:
30
,
majorTickStep
:
5
,
minorTickStep
:
1
});
chart
.
addPlot
(
"default"
,
{
type
:
"Areas"
});
chart
.
addSeries
(
"Series A"
,
seriesA
);
chart
.
addSeries
(
"Series B"
,
seriesB
);
chart
.
addSeries
(
"Series C"
,
seriesC
);
chart
.
addPlot
(
"grid"
,
{
type
:
"Grid"
,
hMinorLines
:
true
});
chart
.
render
();
setInterval
(
"updateTest()"
,
200
);
};
var
updateTest
=
function
(){
seriesA
.
shift
();
seriesA
.
push
(
randomValue
());
chart
.
updateSeries
(
"Series A"
,
seriesA
);
seriesB
.
shift
();
seriesB
.
push
(
randomValue
());
chart
.
updateSeries
(
"Series B"
,
seriesB
);
seriesC
.
shift
();
seriesC
.
push
(
randomValue
());
chart
.
updateSeries
(
"Series C"
,
seriesC
);
chart
.
render
();
};
dojo
.
addOnLoad
(
makeObjects
);
</
script
>
</
head
>
<
body
>
<
h1
>
Chart 2D Updating Data
</
h1
>
<
p
>
Areas, orange theme, axes, grid. Very crude example to show a chart with updating values.
</
p
>
<
div
id
=
"test"
style
=
"width: 400px; height: 400px;"
></
div
>
</
body
>
</
html
>
File Metadata
Details
Attached
Mime Type
text/html
Expires
Sat, Apr 26, 11:11 (1 d, 14 h)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
23392
Default Alt Text
test_chart2d_updating.html (2 KB)
Attached To
rZEDHG ZedLegacy
Event Timeline
Log In to Comment