1

を使用してゲージを実装しようとしていGauge.jsます。グラデーションカラーで実装したい。

これを実装するにはいくつかの問題に直面しています。

現在実装されているゲージのスクリーンショット:

ここに画像の説明を入力

1) グラデーションカラーが機能しない

私のスクリプト:

<script type="text/javascript">
var opts = {
  lines: 30, // The number of lines to draw
  angle: 0.3, // The length of each line
  lineWidth: 0.1, // The line thickness
  pointer: {
    length: 0.9, // The radius of the inner circle
    strokeWidth: 0.035 // The rotation offset
  },
  limitMax: true,   // If true, the pointer will not go past the end of the gauge
  colorStart: '#64A9CC',   // Colors
  colorStop: '#F6735E',    // just experiment with them
  strokeColor: '#000000',   // to see which ones work best for you
  generateGradient: 'true'
};
var target = document.getElementById('gauge'); // your canvas element
var gauge = new BaseDonut(target).setOptions(opts); // create sexy gauge!
gauge.maxValue = 100; // set max gauge value
gauge.animationSpeed = 32; // set animation speed (32 is default value)
gauge.set(50); // set actual value
</script>

また、カーブが少しぼやけているように見えます。何か提案はありますか?

4

1 に答える 1

0

jqChartのゲージを試すことができます。グラデーションをうまくサポートしています。ここに例があります - http://www.jqchart.com/jquery/gauges/RadialGauge/Gradients

免責事項: 私は jqChart で働いています。

敬具、 マキシム・ミレフ

于 2013-12-31T10:51:22.537 に答える