时间戳

首页 > 解决方案 > ExtJS 7.2 图表缺少标记

extjs - ExtJS 7.2 图表缺少标记

问题描述

无论出于何种原因，我的系列都没有在 ExtJS 7.2 中生成标记。以下是我的代码，并附上了当前输出的图像。

    new Ext.chart.series.Line({
        axis: 'left',
        //smooth: true,
        fill:false,
        xField: 'name',
        yField: 'aggregate',
        style: {
            lineWidth: 2,
            stroke: '#30BDA7',
            fillOpacity: 0.5
        },
        title: 'Aggregate Count',
        tooltip:{
            trackMouse:true,
            titleAlign:'center',
            renderer: function(toolTip, record, ctx) {
                toolTip.setHtml(record.get(ctx.field));
            }
        },
        marker: {
           type: 'path',
           path: ['M', - 4, 0, 0, 4, 4, 0, 0, - 4, 'Z'],
           stroke: '#30BDA7',
           //'stroke-width':5,
           lineWidth: 2,
           fill: 'black'
        },
        showMarkers:true,
        selectionTolerance:20
    })

缺少线标记

标签： extjs

解决方案

经过几个小时的搜索，我发现我必须使用延迟渲染向图表添加一个系列。为了修复代码，我只是删除了显式声明“new Ext.chart.series.Line”并将其转换为“type:'line'”。在那之后，一切都神奇地起作用了。这样做的原因是该系列在明确定义时不会生成覆盖表面。

{
    type:'line'
    axis: 'left',
    //smooth: true,
    fill:false,
    xField: 'name',
    yField: 'aggregate',
    style: {
        lineWidth: 2,
        stroke: '#30BDA7',
        fillOpacity: 0.5
    },
    title: 'Aggregate Count',
    tooltip:{
        trackMouse:true,
        titleAlign:'center',
        renderer: function(toolTip, record, ctx) {
            toolTip.setHtml(record.get(ctx.field));
        }
    },
    marker: {
       type: 'path',
       path: ['M', - 4, 0, 0, 4, 4, 0, 0, - 4, 'Z'],
       stroke: '#30BDA7',
       //'stroke-width':5,
       lineWidth: 2,
       fill: 'black'
    },
    showMarkers:true,
    selectionTolerance:20
}

推荐阅读