Kendo Linear Guage с логарифмической шкалой - PullRequest
Новая
       23

Kendo Linear Guage с логарифмической шкалой

0 голосов
/ 19 апреля 2019

Мне нужно представить нелинейную или большую шкалу значений на диаграмме линейного датчика Kendo, выделить другой диапазон значений и пометить несколько значений по шкале.Вызов дается из-за небольшого размера диаграммы, большого диапазона или значения, которое не рендерится / не выглядит хорошо.

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

Я готов переключиться на любую другую библиотеку диаграмм JavaScript (предпочтительно Highcharts /Кендо чарты) для получения этого поведения.

1 Ответ

0 голосов
/ 22 апреля 2019

Вам необходимо установить ширину области датчика. Справочник по API для него. 

<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>
...