Avatar billede toppus Nybegynder
19. juni 2008 - 23:39 Der er 23 kommentarer og
1 løsning

graf brøvl med variabler

har fundet et script som kan lave en graf, men jeg kan ikke finde ud af at indsætte en variabel i stedet for de faste tal som står i script.


<!-- This style behavior tag is required to show the VML and must appear in the document HEAD -->
<style type="text/css">v\:* { behavior: url(#default#VML); }</style>

<!-- Reference the javascript code -->
<script src="XYGraph.js" type="text/javascript"></script>

<!-- IE7 renders differently from IE6 and may need alternate positioning -->
<!--[if IE 7]><style>div.graph {position:relative;}</style><![endif]-->

</head>
<body onload="LoadGraph()">


<script type="text/javascript">

    var MyGraph = new XYGraph(); // define new XYGraph object
    var MyLine = new XYLine();  // define new XYLine object


    // define x,y coordinate points to graph
    MyLine.x = [0, 2.3, 8.8, 17.5, 26.2, 32.7];
    MyLine.y = [2, 2, 3, 3.5, 6, 12];

   
    function LoadGraph() {graphdiv.innerHTML=MyGraph.Plot(MyLine);}

</script>
<div id="graphdiv" class="graph"></div>
<p>This page contains the minimum required code for a graph.
<br /> Note that the only required input is x and y data points.
</p>


myline.x og myline.y skulle gerne kunne indeholde en variabel med tal.
f.eks MyLine.x = tal1;
Kan dette lade sig gøre??
Avatar billede olebole Juniormester
20. juni 2008 - 00:05 #1
<ole>

Jamen, hvis du udskifter de to arrays med to tal, kan du jo kun afsætte et punkt. Det er der jo ikke meget graf over. Prøv at forklare, hvad du vil lave og hvorfor  =)

/mvh
</bole>
Avatar billede toppus Nybegynder
20. juni 2008 - 16:35 #2
Hej olebole igen :)
Jeg har et script (google map) som hvor du hjælp til med at få oplyst en højde via asp (xmlhttp). Der er oprette en variabel som hvergang man klikker bliver tilføjet den næste højde. Så variablen indeholder en tekst som f.eks ser ud som følgende:
Afstand = "0, 12.5 , 20.3"
Hoejde = "13, -1, 2,"
Disse 2 variabler ville jeg gerne kunne indsætte i  MyLine.x = afstand og  MyLine.y = hoejde.  Giver det mening ??
Avatar billede roenving Novice
20. juni 2008 - 17:21 #3
Måske:

MyLine.x = new Array(Afstand);
MyLine.y = new Array(Hoejde);
Avatar billede olebole Juniormester
20. juni 2008 - 18:00 #4
var Afstand = "0, 12.5 , 20.3";
var Hoejde = "13, -1, 2,";

MyLine.x = Afstand.split(",");
// for (var x=MyLine.x,i=x.length; i>=0; i--) x[i] = Number(x[i]);

MyLine.y = Hoejde.split(",");
// for (var y=MyLine.y,i=y.length; i>=0; i--) y[i] = Number(y[i]);

Formodentlig er de to for-løkker ikke nødvendige. Ellers må du lige fjerne udkommenteringen  :)
Avatar billede olebole Juniormester
20. juni 2008 - 18:01 #5
- men du ved godt, at koden er IE-only, ikke?  =)
Avatar billede toppus Nybegynder
20. juni 2008 - 18:22 #6
>>Roenving  ser ud til at virke, men er nok løbet ind i et andet problem som nok har noget med gra koden at gøre. Første gang jeg kikker på kortet opretter den  en højde og en afstand i grafen, men 2, 3 osv så kommer grafen ikke til syne mere :(

>> Olebole Jo IE ved det godt, men er også til helt privat brug :)
Når
function LoadGraph()
{graphdiv.innerHTML=MyGraph.Plot(MyLine);}

bliver kørt (hvergang der bliver klikket), burde den så ikke bare "overskrive"???
Avatar billede toppus Nybegynder
20. juni 2008 - 19:08 #7
OLEBOLE du vandt :)
Det virkede da jeg satte de 2 linier ind, (uden de 2 for-lykker):)
Smid lige et svar igen igen :)
Rigtig god weekend til alle
Avatar billede toppus Nybegynder
20. juni 2008 - 21:12 #8
er der forresten en af jer der kender dette graf script mhp ændringer i størrelse forhold ??
Avatar billede olebole Juniormester
20. juni 2008 - 22:33 #9
Jeg ville nok ændre højde/bredde, inden tallene bliver sendt til MyGraph.Plot, men jeg ved ikke, hvordan de opstår, så det kan jeg ikke på nuværende tidspunkt. Link til dit eksempel, så skal jeg kikke på det  =)
Avatar billede olebole Juniormester
20. juni 2008 - 22:34 #10
- og jo, grafen burde overskrives, når du kalder LoadGraph
Avatar billede olebole Juniormester
20. juni 2008 - 22:49 #11
Nu har jeg downloaded koden. Hvad vil du vide?
Avatar billede toppus Nybegynder
20. juni 2008 - 23:36 #12
Det er service :) hvis min længde (x) kommer over 10, går linien ud over grafen

_linien__________________________> (20)

--|--|--|--|(stopper
1 4 6 8 10    her)

som om den er sat til 10 et eller andet sted
Avatar billede toppus Nybegynder
20. juni 2008 - 23:40 #13
mht "grafen burde overskrives" så blev det løst ved at indsætte dine 2 linier :)
Avatar billede toppus Nybegynder
20. juni 2008 - 23:41 #14
Eller retter det er vel grafen der går ud over graf området
Avatar billede toppus Nybegynder
20. juni 2008 - 23:50 #15
Og bare til alm oplysning så skulle det hele ende i noget i denne stil, men på denne side er det bare ikke altid at det virker uden for USA
http://www.gmap-pedometer.com/
Avatar billede olebole Juniormester
21. juni 2008 - 00:04 #16
Det med at grafen går ud over området, må skyldes noget andet i din kode. Det kommer bl.a. anpå, hvad du sætter af properties på graf objektet.

En helt anden ting er så, at jeg nok ville skrive et mere skræddersyet library. Til dit formål, udfører det valgte library oceaner af spildt arbejde
Avatar billede toppus Nybegynder
21. juni 2008 - 00:38 #17
Ja, det ser jo lidt voldsomt ud, men det er det bedste jeg har kunne finde.
har du nogle ide om hvor jeg kan finde noget der kan lave en simpel X Y graf??
der findes jo masser af bar grafer , men dem kan jeg ikke lige bruge til noget.
Avatar billede olebole Juniormester
22. juni 2008 - 17:11 #18
I princippet er det vel ikke meget mere end dette, du skal bruge:

<style type="text/css">
v\:* {
    behavior: url(#default#VML);
    display: inline-block;
}
#curveCont {
    position: relative;
}
</style>

<script type="text/javascript">
function drawCurve(sCoords) {
    var o = document.getElementById("myLine");
    o.points.value = sCoords;
}
</script>

<p>
    <button onclick="drawCurve('30px,20px 200px,300px')">TEST A</button>
    <button onclick="drawCurve('30px,20px 200px,300px 100px,50px')">TEST B</button>
    <button onclick="drawCurve('30px,20px 200px,300px 100px,50px 400px,150px')">TEST C</button>
</p>

<div id="curveCont">
    <v:polyline id="myLine" title="line">
        <v:stroke weight="1px" color="red" dashstyle="solid" />
        <v:fill on="false" />
    </v:polyline>
</div>
Avatar billede toppus Nybegynder
23. juni 2008 - 20:55 #19
Det ser simpelt ud, men hvordan skal det erstatte det som jeg bruger nu ??
Skal det gemmes som en *.js fil eller ??
Avatar billede olebole Juniormester
24. juni 2008 - 00:10 #20
For det første forstår jeg ikke, hvorfor du ikke bruger GMaps egen VML implementering:
    http://code.google.com/apis/maps/documentation/overlays.html#Polylines_Overview

Hvis det ikke er til et Google Map, så ved jeg ikke, hvor dine koordinatsæt kommer fra. Hvis du i stedet for at formatere dem som:
    Afstand = "0, 12.5 , 20.3"
    Hoejde = "13, -1, 2,"

- kunne formatere dem som:
    koordinater = "0,13 12.5,-1 20.3,2"

- kan du smide det direkte ind i funktionen:
    drawCurve(koordinater);

Hvad koden angår, så test den i et tomt dokument. Derudover har jeg ingen idé om, hvad du skal gøre. Jeg kender jo ikke konteksten  =)
Avatar billede toppus Nybegynder
24. juni 2008 - 17:33 #21
Nu har jeg prøvet det i et tomt dokument, men der komme en fejl der siger:'
points er null eller ikke et objekt
Kode 0
Avatar billede olebole Juniormester
24. juni 2008 - 20:26 #22
Det forstår jeg ikke. Prøv:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Draw Curve</title>
<style type="text/css">
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
v\:* {
    behavior: url(#default#VML);
    display: inline-block;
}
#curveCont {
    position: relative;
}
</style>
<script type="text/javascript">
function drawCurve(sCoords) {
    var o = document.getElementById("myLine");
    o.points.value = sCoords;
}
</script>
</head>
<body>

<p>
    <button onclick="drawCurve('30px,20px 200px,300px')">TEST A</button>
    <button onclick="drawCurve('30px,20px 200px,300px 100px,50px')">TEST B</button>
    <button onclick="drawCurve('30px,20px 200px,300px 100px,50px 400px,150px')">TEST C</button>
</p>

<div id="curveCont">
    <v:polyline id="myLine" title="line">
        <v:stroke weight="1px" color="red" dashstyle="solid" />
        <v:fill on="false" />
    </v:polyline>
</div>

</body>
</html>
Avatar billede toppus Nybegynder
24. juni 2008 - 21:55 #23
Så virker det, det giver mig noget at arbejde med.. Takker mange gange
Avatar billede olebole Juniormester
24. juni 2008 - 21:57 #24
;o)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester