7

我一直在寻找在 webapps 中生成图表的各种方法,并发现HighCharts特别有用。该应用程序需要满足色盲的需求,因此我正在考虑使用模式而不是填充颜色 - 如本问题所述。

像这样的东西需要在<defs>SVG 的部分:

<pattern id="triangles"  width="10" height="10" patternUnits="userSpaceOnUse">
    <polygon points="5,0 10,10 0,10"/>
</pattern>
<pattern id="diagonal-hatch" patternUnits="userSpaceOnUse" width="4" height="4">
    <path d="M-1,1 l2,-2 M0,4 l4,-4 M3,5 l2,-2"/>
</pattern>
<pattern id="cross-hatch" patternUnits="userSpaceOnUse" x="0" y="0" width="6" height="6">
    <g style="fill:none; stroke:#22fa23; stroke-width:1">
        <path d="M0,0 l10,10"/>
        <path d="M10,0 l-10,10"/>
    </g>
</pattern>

然后fill="#0d233a"我会fill="url(#triangles)"

有没有其他人用 HighCharts 做到这一点?是否有可能让 HighCharts 做到这一点而无需将其分解成碎片?

4

2 回答 2

5

似乎有一个图案填充插件

于 2013-07-03T13:22:41.863 回答
4

您可以为此使用 Highcharts插件。主题是在这里创建的。

例如系列模式:

{
    type: 'column',
    data: [148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6],
    color: {
        pattern: 'http://highcharts.com/demo/gfx/pattern2.png',
        width: 6,
        height: 6,
        // VML only:
        color1: 'red',
        color2: 'yellow'
    }
}
于 2013-07-04T10:01:01.513 回答