【问题标题】:How to hide kendo jquery chart value axis unit labels如何隐藏剑道jquery图表值轴单位标签
【发布时间】:2019-02-18 11:53:22
【问题描述】:

我正在尝试使用 kendo jquery 图表绘制一个折线图,其中值轴和类别轴将在某个点相交。

我在剑道论坛https://www.telerik.com/forums/dynamic-vertical-line-in-charts跟进了这个问题

我选择创建多个价值轴。到目前为止,我能够绘制如下图所示的图表,但无法从左侧的值轴上删除单位标签。

任何人都可以帮助解决如何从蓝色值轴上删除单位标签或有更好的方法吗?

这里是示例代码:

function drawChart(data) {
   var series = [
      {
         name: "Series1",
         color: "#96DF73",
         markers: {
            visible: false
         },
         data: data.Series1
      },
      {
         color: "#00B0F2",
         width: 4,
         markers: {
            visible: false
         },
         data: Array.from({ length: 8 }).fill(3.2)
      }
   ];

   $("#divChart").kendoChart({
      legend: {
         position: "top"
      },
      seriesDefaults: {
         type: "line",
         style: "smooth",
         tooltip: {
            visible: true
         },
         axis: "defaultCatAxis"
      },
      chartArea: {
         background: "#f1f1f1"
      },
      plotArea: {
         background: "white"
      },
      series: multiSpeedSeries,
      categoryAxis: {
         title: {
            text: "Category"
         },
         categories: [0, 1000, 2000, 4000, 6000, 8000, 10000, 12000],
         axisCrossingValues: [0, 5],
         justified: true,
         minorGridLines: {
            visible: true
         }
      },
      valueAxes: [
         {
            name: "defaultCatAxis",
            title: {
               text: "defaultCatAxis"
            },
            minorGridLines: {
               visible: true
            },
            min: 1
         },
         {
            labels: {
               //width: 3,
               visibility: false
            },

            line: {
               color: "#00B0F2",
               width: 4
            }
         }
      ]
   });
}

【问题讨论】:

  • 如果我正确阅读了这个问题,我认为这个道场可能会有所帮助:dojo.telerik.com/otuBehiq 如果是,我会将其添加为您的答案。
  • @DavidShorthose 我想从蓝色值/垂直轴上删除单位标签/文本
  • 是的,这行得通。也隐藏次要单位,错过添加问题
  • 我已经调整了最后一个道场,所以它为你隐藏了次要行dojo.telerik.com/otuBehiq/2

标签: jquery kendo-ui kendo-chart


【解决方案1】:

你的代码与你做标签的方式差不多,它只是一些带有属性定义的typos

参见 dojo 示例:dojo.telerik.com/otuBehiq/2

我所做的只是更正您的轴定义:

 {
            labels: {
               //width: 3,
               visibility: false
            },

            line: {
               color: "#00B0F2",
               width: 4
            }
         }

到:

 {
                    labels: {
                        //width: 3,
                        visible:false
                    },

                    line: {
                        color: '#00B0F2',
                        width: 4,
                    }
                }

注意它是visible 而不是visibility

至于您在 cmets 中的问题的第二部分,您需要扩展图表中您实际需要/期望的内容,因为我已从图表中删除了次要值和网格线,因此尚不清楚。

【讨论】:

  • 谢谢,这解决了问题。我无法发现这种差异
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-12-03
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-05-04
相关资源
最近更新 更多