Forum: PC-Programmierung Java Script variable zu weisen


Announcement: there is an English version of this forum on EmbDev.net. Posts you create there will be displayed on Mikrocontroller.net and EmbDev.net.
von peer (Gast)


Lesenswert?

hallo,
Ich spiele ein bischen in den Beispielen , so nun meine Frage wie kann 
ich eine Variable zu weisen.

Wenn ich jetzt  im //JS SCRIPT
colors:{plate:"#222" so schreibe dann wird mir auch die richtige Farbe 
angezeuigt.

aber so eben nicht //JS SCRIPT
colors:{plate:data-color-plate
Was mache ich hier falsch

1
  <canvas id="t1" data-color-plate="#00FFFF"
2
                  data-title="WOHN" 
3
          data-units="Temp. &deg;C" width="350" height="350" 
4
          data-major-ticks="0 10 20 30 40 50" 
5
          data-type="canv-gauge" 
6
          data-min-value="0" 
7
          data-max-value="50" 
8
          data-highlights="0 5 #AFEEEE, 5 22 #00FF00, 22 30 #FFA500, 30 40 #FF0000, 40 50 #B22222" 
9
          data-color-plate="#222"
10
          data-onready="setInterval( function() { Gauge.Collection.get('t1').setValue(data_t[0]);}, 200);">
11
                  </canvas>
12
13
//JS SCRIPT
14
colors:{plate:data-color-plate,
15
majorTicks:"#444",
16
minorTicks:"#666",
17
title:"#888",
18
units:"#888",
19
numbers:"#444",n
20
eedle:{start:"rgba(240, 128, 128, 1)",
21
end:"rgba(255, 160, 122, .9)"}},
22
highlights:[{from:20,to:60,color:"#eee"},
23
{from:60,to:80,color:"#ccc"},
24
{from:80,to:100,color:"#999"}]};
25
var y=0,E=this,n=0,I=0,H=!1;this.setValue=

von Cyblord -. (Gast)


Lesenswert?

Du musst das data-Attribut auswerten.

von peer (Gast)


Lesenswert?

Abradolf L. schrieb:
> Du musst das data-Attribut auswerten.


könnten sie mir kurz unter die Arme greifen wie das richtig gemacht 
wird.
1
    domReady(function()
2
     {
3
      function b(b)
4
       {
5
        for(var e=b[0],d=1,g=b.length;d<g;d++)e+=b[d].substr(0,1).toUpperCase()+b[d].substr(1,b[d].length-1);
6
      return e
7
       }
8
       for(var l=document.getElementsByTagName("canvas"),q=0,v=l.length;q<v;q++)
9
        if("canv-gauge"==l[q].getAttribute("data-type"))
10
       {
11
        var k=l[q],e={},g,p=parseInt(k.getAttribute("width"),10),w=parseInt(k.getAttribute("height"),10);
12
        e.renderTo=k;
13
        p&&(e.width=p);
14
        w&&(e.height=w);
15
        p=0;
16
        for(w=k.attributes.length;p<w;p++)
17
        if(g=k.attributes.item(p).nodeName,"data-type"!=g&&"data-"==g.substr(0,5))
18
         {
19
          var d=g.substr(5,g.length-5).toLowerCase().split("-");
20
         if(g=k.getAttribute(g))switch(d[0])
21
          {
22
           case "colors":d[1]&&(e.colors||(e.colors={}),"needle"==d[1]?(d=g.split(/\s+/),e.colors.needle=d[0]&&d[1]?{start:d[0],end:d[1]}:g):(d.shift(),e.colors[b(d)]=g));
23
           break;
24
           case "highlights":e.highlights||(e.highlights=[]);
25
           g=g.match(/(?:(?:-?\d*\.)?(-?\d+){1,2} ){2}(?:(?:#|0x)?(?:[0-9A-F|a-f]){3,8}|rgba?\(.*?\))/g);
26
           for(var d=0,J=g.length;d<J;d++)
27
            {
28
           var s=g[d].replace(/^\s+|\s+$/g,"").split(/\s+/),x={};
29
                     s[0]&&""!=s[0]&&(x.from=s[0]);
30
           s[1]&&""!=s[1]&&(x.to=s[1]);
31
           s[2]&&""!=s[2]&&(x.color=s[2]);
32
           e.highlights.push(x)
33
          }
34
          break;
35
          case "animation":d[1]&&(e.animation||(e.animation={}),"fn"==d[1]&&/^\s*function\s*\(/.test(g)&&(g=eval("("+g+")")),e.animation[d[1]]=g);
36
          break;
37
          default:d=b(d);
38
          if("onready"==d)
39
          continue;
40
          if("majorTicks"==d)g=g.split(/\s+/);
41
          else if("strokeTicks"==d||"glow"==d)g="true"==g?!0:!1;
42
          else if("valueFormat"==d)
43
          if(g=g.split("."),2==g.length)g={"int":parseInt(g[0],10),dec:parseInt(g[1],10)};
44
          else continue;
45
                    e[d]=g}}e=new Gauge(e);
46
          k.getAttribute("data-value")&&e.setRawValue(parseFloat(k.getAttribute("data-value")));
47
          k.getAttribute("data-onready")&&(e.onready=function()
48
           { 
49
            eval(this.config.renderTo.getAttribute("data-onready"))});
50
            e.draw()}});
51
          window.Gauge=Gauge;
52
                <!-- Gauge Code Ends -->

von peer (Gast)


Lesenswert?

Könnte mir vielleicht jemand von ihnen erklären oder zeigen wie ich das 
"data Attribut" auswerte.

Antwort schreiben

Die Angabe einer E-Mail-Adresse ist freiwillig. Wenn Sie automatisch per E-Mail über Antworten auf Ihren Beitrag informiert werden möchten, melden Sie sich bitte an.

Wichtige Regeln - erst lesen, dann posten!

  • Groß- und Kleinschreibung verwenden
  • Längeren Sourcecode nicht im Text einfügen, sondern als Dateianhang

Formatierung (mehr Informationen...)

  • [c]C-Code[/c]
  • [code]Code in anderen Sprachen, ASCII-Zeichnungen[/code]
  • [math]Formel in LaTeX-Syntax[/math]
  • [[Titel]] - Link zu Artikel
  • Verweis auf anderen Beitrag einfügen: Rechtsklick auf Beitragstitel,
    "Adresse kopieren", und in den Text einfügen




Bild automatisch verkleinern, falls nötig
Bitte das JPG-Format nur für Fotos und Scans verwenden!
Zeichnungen und Screenshots im PNG- oder
GIF-Format hochladen. Siehe Bildformate.
Hinweis: der ursprüngliche Beitrag ist mehr als 6 Monate alt.
Bitte hier nur auf die ursprüngliche Frage antworten,
für neue Fragen einen neuen Beitrag erstellen.

Mit dem Abschicken bestätigst du, die Nutzungsbedingungen anzuerkennen.