首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >剑道角2图

剑道角2图
EN

Stack Overflow用户
提问于 2016-10-14 14:49:51
回答 1查看 1.2K关注 0票数 2

现有的图表代码如下:

代码语言:javascript
复制
jQuery("#staarAllSubjectGrades").kendoChart({
    legend: {
        visible: true,
        position: 'bottom'
    },
    seriesDefaults: {
        type: "column",
        labels: {
            visible: true,
            template: "#= (!value || value < 0) ? 'N/A' : (value).toFixed(0) + '%' #",
        }
    },
    tooltip: {
        visible: true,
        template: "#= series.name #: #= (!value || value < 0) ? 'N/A' : (value).toFixed(0) + '%' #",
        color: 'white'
    },
    dataSource: {
        data: finalData
    },
    series: series,
    valueAxis: {
        majorGridLines: {
            visible: true
        },
        labels: {
            template: "#= (value).toFixed(0) # %"
        },
        visible: true,
        min: 0
    },
    categoryAxis: {
        field: "DISTNAME",
        labels: { visible: this.stateStaarAllSubjectGrades },
        majorGridLines: {
            visible: false
        },
        line: {
            visible: false
        }
    }
})

输出图类似于:

现有-图表-输出

当我使用以下的角2剑道图代码时:

代码语言:javascript
复制
<kendo-chart>
    <kendo-chart-category-axis>
        <kendo-chart-category-axis-item [categories]="chartStaarAllSubjectGrades.categories">
            <kendo-chart-category-axis-item-labels [visible]="stateStaarAllSubjectGrades">
            </kendo-chart-category-axis-item-labels>
            <kendo-chart-category-axis-item [majorGridLines]="{ visible: false }" [line]="{ visible: true }">
            </kendo-chart-category-axis-item>
        </kendo-chart-category-axis-item>
    </kendo-chart-category-axis>
    <kendo-chart-series>
        <kendo-chart-series-item [data]="chartStaarAllSubjectGrades.series"> 
        </kendo-chart-series-item>
    </kendo-chart-series>
    <kendo-chart-value-axis>
        <kendo-chart-value-axis-item>
            <kendo-chart-value-axis-item-labels [content]="value + '%'">
            </kendo-chart-value-axis-item-labels>
        </kendo-chart-value-axis-item>
    </kendo-chart-value-axis>
</kendo-chart> 

然后输出如下:

新输出

请协助我如何在图表的左边显示“%”,以及如何显示与现有输出类似的标签

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-10-17 17:30:25

我得设法解决这个问题。以下是代码:

代码语言:javascript
复制
 <kendo-chart>
  <kendo-chart-legend position="bottom"></kendo-chart-legend>
  <kendo-chart-series-defaults type="column">
   <kendo-chart-series-defaults-labels format="p">
   </kendo-chart-series-defaults-labels>
  </kendo-chart-series-defaults>

 <kendo-chart-series> 
  <kendo-chart-series-item  *ngFor="let item of chartStaarAllSubjectGrades.series" [name]="item.category" [data]="[item]">  
  </kendo-chart-series-item>  
 </kendo-chart-series>

  <kendo-chart-value-axis>
   <kendo-chart-value-axis-item>
       <kendo-chart-value-axis-item-labels format="p">
       </kendo-chart-value-axis-item-labels>
   </kendo-chart-value-axis-item>
 </kendo-chart-value-axis>

 </kendo-chart> 
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/40046078

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档