Javascript 如何使用ZingChart创建此图表

我正试图用ZingChart创建一个类似于此的图表

我已经尽我所能调整了一个条形图，但我仍然没有接近

---

ZingChart可以使用此图表吗

下图是根据您所附的剪贴画模仿的。如果你对我所做的事有任何疑问，我一定会详细说明

注意：要获得最佳查看结果，请在全页视图中查看图表

var myConfig={
类型：'混合'，
标题：{
文本：“按英里/小时排名”，
},
scaleX：{
偏移量：0，//强制线以比例开始
offsetEnd:10，//强制最后一个条远离刻度末端
maxItems:2，//强制显示第一个和最后一个标签
勾选：{
可见：假，
},
项目：{
fontColor:“#000”，
尺寸：14，
规则：[//调整最后一个标签
{
规则：'%i==16'，
正文：“129”，
}  
]
},
线宽：2，
线条颜色：“#000”，
},
斯卡利：{
最小值：0，
最大值：100，
步骤：50，
格式：“%v%”，
标记：[
{//对角线
键入：“行”，
范围：[0100]，
线宽：3，
线条颜色：“#000”，
}  
],
勾选：{
可见：假，
},
项目：{
fontColor:“#000”，
尺寸：14
},
指南：{
可见：假，
},
线宽：2，
线条颜色：“#000”，
},
标签：[
{//将标签钩住线标记以显示等级
hook:'node:plot=1，index=1'，
背景颜色：“#000”，
fontColor:“#fff”，
文本：“排名11/16”，
宽度：20，
标注：正确，
位置：'底部'，
填充：15，
边界半径：10，
尺寸：15，
副职：-50，
},    
{//挂钩标签可缩放以显示英里/小时
钩子：“比例：指数=11”，
文字：“100英里/小时”，
尺寸：15，
副职：15，
},
],
系列：[
{
类型：'bar'，
条宽：20，
杆间距：1，
边界半径：'10100'，
背景颜色：“#C0”，
工具提示：{
背景颜色：“#000”，
文本：“排名%i/16”，
宽度：20，
标注：正确，
位置：'底部'，
填充：15，
边界半径：10，
尺寸：15，
位置：'节点：顶部'，
副职：-20，
},
规则：[
{//将一条变成紫色
规则：'%i==11'，
背景颜色：“紫色”，
}
],
值：[null，5,9,12,19,25,30,34,39,45,49,54,58,65,69,74,79]，
},
{
键入：“行”，
线条颜色：“紫色”，
线条样式：“虚线”，
valueBox：{
文本：“%v%”，
位置：'左'，
抵销额：-18，
尺寸：12，
规则：[
{//隐藏行上节点处的值框
规则：“%i==1”，
可见：假，
}  
],
},
标记：{
边框颜色：“紫色”，
边界宽度：2，
背景颜色：“#fff”，
尺码：9，
规则：[
{//隐藏行的第一个标记
规则：“%i==0”，
可见：假，
}  
],
},
值：[[0,69]，[11,69]，//用于更好地绘制直线的数组数组
}
]
};
zingchart.render（{
id:'我的图表'，
资料来源：myConfig，
高度：“100%”，
宽度：“100%”，
});
html，正文{
身高：100%；
宽度：100%；
保证金：0；
填充：0；
}
#我的图表{
身高：100%；
宽度：100%；
最小高度：150px；
}
.zc参考号{
显示：无；
}
谢谢！我没有意识到我可以组合图表！