关于折线颜色问题:总共有17个点,其中第1-3个,第5-6个,第10-11,第12-13个点是重合的,它们中间没有线段,所以折线图实际只有11条线段,那么颜色数组也只有前11项会生效,因为前11项都是绿色,所以呈现的效果就是纯绿色折线。关于折线样式问题:colors.forEach(() => { patterns.push({ type: 0, length: 10 }) })这里或许是想为折线的每个线段分别制定样式。但是patterns参数是这样的:type为0是为实线,type为1时为圆点,type为2时为空白,它们后面的length值是比例,通过这三种的组合来实现样式。比如,将上述这段代码改为:let patterns: mapCommon.PatternItem[] = [{ type: 0, length: 10 }, { type: 1, length: 10 }, { type: 2, length: 10 }] 这样呈现出来的就是直线,圆点,空白三者相间(1:1:1)的效果。如果改为:let patterns: mapCommon.PatternItem[] = [{ type: 0, length: 10 }, { type: 2, length: 10 }] 呈现出来的就是虚线的效果(实线与空白1:1相间)。如果只是将上述的代码把type改为2,那么呈现的效果就是连续的空白,看不见折线了。
关于折线颜色问题:总共有17个点,其中第1-3个,第5-6个,第10-11,第12-13个点是重合的,它们中间没有线段,所以折线图实际只有11条线段,那么颜色数组也只有前11项会生效,因为前11项都是绿色,所以呈现的效果就是纯绿色折线。
关于折线样式问题:
这里或许是想为折线的每个线段分别制定样式。但是patterns参数是这样的:type为0是为实线,type为1时为圆点,type为2时为空白,它们后面的length值是比例,通过这三种的组合来实现样式。
比如,将上述这段代码改为:
这样呈现出来的就是直线,圆点,空白三者相间(1:1:1)的效果。如果改为:
呈现出来的就是虚线的效果(实线与空白1:1相间)。如果只是将上述的代码把type改为2,那么呈现的效果就是连续的空白,看不见折线了。