KendoUI stockchart 标记绘制轴方面的问题

Question

我正在尝试使用 kendoUI 创建股票图表。一切正常，但存在一些问题。标记的绘制不符合预期。它没有放置在图表区域的所需点上。

这是我为它完成的代码：

$($context).kendoStockChart({
    dataSource : {
        data : data.ChartData,
        sort : {
            field : "Date",
            dir : "asc"
        }
    },
    seriesDefaults : {
        markers : {
            background : function (a) {
                return a.dataItem.color;
            },
            visible : true,
            type : "triangle",
            size : 18
        },
        line : {
            width : 0
        }
    },
    series : [{
            type : "line",
            field : "Index",
            categoryField : "Date",
            labels : {
                background : "transparent",
                color : function (a) {
                    return a.dataItem.color === "#000000" ? "#ffffff" : "ffffff";
                },
                visible : true,
                position : "insideEnd",
                margin : {
                    top : 8,
                    left : -18
                },
                font : "10px sans-serif",
                center : '5%',
                template : "#= dataItem.TotalCount > 1 ? dataItem.TotalCount : '' #"
            }

        }
    ],
    title : {
        text : "Time View Chart"
    },
    dateField : "Date",
    navigator : {
        series : {
            type : "line",
            field : "Index",
            categoryField : "Date",
            markers : {
                visible : true,
                type : "triangle",
                size : 8
            }
        }
    },
    valueAxis : {
        labels : {
            //format: "{0}",
            visible : true,
            template : function (obj) {
                return data.indexCategories[obj.value] || "";
            }
        },
        minorUnit : 1,
        majorUnit : 1,
        title : {
            text : ""
        },
        line : {
            visible : true
        }
    }
});

Answer 1

尝试将 categoryAxis justified 属性设置为 false，然后为 valueAxis 设置最小值和最大值以包含您的所有点并留出一些空间。

 categoryAxis: {
    justified: false,
 },
 valueAxis: {
    min: <lowest val in your data>,
    max: <highest value plus some margin for the trianb=gle marker>
 },

DEMO

KendoUI stockchart 标记绘制轴方面的问题

KendoUI stockchart marker plotting issue respect to axes

charts

kendo-ui