【问题标题】:Kendo Linear Guage with logarithmic scale对数刻度的剑道线规
【发布时间】:2019-04-19 16:46:20
【问题描述】:

我需要在 Kendo 线性仪表图表中表示非线性或大比例的值,并突出显示不同的值范围并在比例上标记多个值。挑战是图表尺寸小、范围大或值不呈现/看起来不错。

http://dojo.telerik.com/@kk8322/ULokuFuZ

我已准备好切换到任何其他 javascript 图表库(最好是 Highcharts/Kendo 图表)以获得此行为。

【问题讨论】:

    标签: javascript charts highcharts kendo-chart


    【解决方案1】:

    您需要设置仪表区域的宽度。 API Reference for it.

    <script>
                    $(document).ready(function() {
                        $("#gauge").kendoLinearGauge({                        
                     gaugeArea:{
                         width:500
                     },         
                     pointer: [{
                        value: 670000,
                        shape: "arrow",
                        color: "black"
                    }, {
                        value: 480000,
                        color: "blue",
                        shape: "arrow"
                    }, {
                        value: 570000,
                      size: 15,
                        color: "blue",
                        shape: "arrow"
                    }],
    
                            scale: {
                                min: 470000,
                                max: 770000,
                                vertical: false,
                                ranges: [{
                                        from: 470000,
                                        to: 470500,
                                        color: "#c20000"
                                    },{
                                        from: 470500,
                                        to: 471000,
                                        color: "yellow"
                                    }, {
                                        from: 771500,
                                        to: 770500,
                                        color: "yellow"
                                    }, {
                                        from: 770500,
                                        to: 770000,
                                        color: "#c20000"
                                    }]
                            }
                        });
                    });
                </script>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-06-21
      • 2012-01-25
      • 2021-02-22
      • 1970-01-01
      • 1970-01-01
      • 2013-02-16
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多