7

ゲージにセクターごとの色を表示させようとしています（つまり、var g1では、緑0-10、オレンジ11-22、赤23-34が必要です）。

それを行うオプションはありますが、私のような初心者のための明確な指示はありません。

どんな助けでもいただければ幸いです。

http://www.justgage.com 

<script>
  var g1 = new JustGage({
    id: "score", 
    value: <?php
print $content['field_anger_score'][0]['#markup'];
?>, 
    min: 0,
    max: 34,
    title: "Your Anger Score",
levelColorsGradient: false
  }); 
 var g2 = new JustGage({
    id: "passive-aggressive", 
    value: <?php
print $content['field_passive_aggressive_score'][0]['#markup'];
?>, 
    min: 0,
    max: 14,
    title: "Passive Aggressive"
  }); 
var g3 = new JustGage({
    id: "aggressive", 
    value: <?php
print $content['field_aggressive_score'][0]['#markup'];
?>, 
    min: 0,
    max: 6,
    title: "Aggressive"
  }); 
var g4 = new JustGage({
    id: "assertive", 
    value: <?php
print $content['field_assertive_score'][0]['#markup'];
?>, 
    min: 0,
    max: 4,
    title: "Assertive"
  });

</script>

dfg

4

4 に答える 4

12

levelColorsGradient: false最初のゲージ（g1）を設定するときに使用しているようです。ドキュメントに従ってそれを行う必要があります。

文書によると

表示された値のセクターベースの色表現を選択します。これは、33％未満のすべての値で色が緑色のままで、34％から66％まで黄色のままであることを意味します。67％を超えると、ゲージが赤く光ります。これらの3つはデフォルトの色です。

あなたがあなた自身の色を定義したいなら、ドキュメントは言います

// levelColors：string []

//インジケーターの色（下から上へ、RGB形式）

したがって、独自の色の変数を作成し、必要な色に合わせて以下のRGB値を変更します。

var myColors = [
  "#a9d70b",
  "#f9c802",
  "#ff0000"
]

そして、ゲージを設定するときにこのオプションを設定します。

levelColors : myColors

または、すべてをまとめておきたい場合は、変数をスキップしてこれを実行します。真ん中の値をオレンジ色に変更します。

 levelColors : [  "#a9d70b", "#F27C07",  "#ff0000" ]

ゲージは現在デフォルトの色を示していますか？セクターを変更できるとは思いません。パーセントに基づいています。

于 2013-03-26T17:37:12.803 に答える
6

customSectorsプロパティで色を設定できます

var g1 = new JustGage({
  id: "score", 
  value: <?php
    print $content['field_anger_score'][0]['#markup'];
   ?>, 
  min: 0,
  max: 34,
  title: "Your Anger Score",
  customSectors : [{"lo":0,"hi":10,"color":"#a9d70b"},
                   {"lo":11,"hi":22,"color":"#f9c802"},
                   {"lo":23,"hi":34,"color":"#ff0000"}],
  levelColorsGradient: false
});
于 2014-05-06T12:07:28.197 に答える
0

3色を設定すると、それぞれが33％を表します。5色を設定すると、それぞれが20％になります。100％スケールで最大限に制御するには、100要素の配列を設定でき、それぞれが1％を表します。色を繰り返すことができるため、最初の20％を赤にするために、最初の20個をすべて「＃ff0000」にすることができます。など。これは、指示では私には明確ではありませんでした。

于 2015-04-16T01:39:14.973 に答える
0

customSectosをpercents：true、

######September 26, 2016. - release 1.2.9

######customSectors receives structural update + additional "percents" feature (define ranges in %).   
    customSectors: {
          percents: true,
          ranges: [{
            color : "#43bf58",
            lo : 0,
            hi : 50
          },{
            color : "#ff3b30",
            lo : 51,
            hi : 100
          }]
        }

参照：https ：//github.com/toorshia/justgage

于 2017-06-15T16:26:34.620 に答える