@abcnews/react-australia-map 中文文档教程
Electorate Map
与 @abcnews/scrollyteller 结合使用的澳大利亚选区地图。
Usage
@abcnews/react-australia-map 用于 @abcnews/scrollyteller。
<Scrollyteller {...}>
<Map
data={data}
processData={processData}
setupLegend={setupLegend}
marker={marker}
onZoom={onZoom}
fill={fill}
labelText={labelText}
/>
</Scrollyteller>
processData(d) - 对于每个数据点，附加辅助渲染所需的任何额外信息。
setupLegend(svg, legend) - 在主地图添加到 svg 后调用。 legend 是对 svg 组的引用，在 onZoom 期间也可以引用该组。
marker - 当前的 scrollyteller 标记。
onZoom(zoomFactor, svg, legend) - 在定位/缩放主地图后调用。 zoomFactor 是缩放级别本身的倒数，因此您可以使用它来缩放与地图缩放比例成反比的事物。
fill(d) - 给定一个数据点，返回一个颜色字符串来填充该地图段。
labelText(d) - 给定一个数据点，返回用于标记该地图段的字符串。
Authors
- Nathan Hoad - hoad.nathan@abc.net.au
Electorate Map
A map of Australian electorates to use in conjunction with @abcnews/scrollyteller.
Usage
@abcnews/react-australia-map is meant to be used within an @abcnews/scrollyteller.
<Scrollyteller {...}>
<Map
data={data}
processData={processData}
setupLegend={setupLegend}
marker={marker}
onZoom={onZoom}
fill={fill}
labelText={labelText}
/>
</Scrollyteller>
processData(d) - For each data point, attach any extra information needed to helper render.
setupLegend(svg, legend) - Called after the main map is added to the svg. legend is a reference to an svg group that can also be referred to during onZoom.
marker - The current scrollyteller marker.
onZoom(zoomFactor, svg, legend) - Called after the main map has been located/zoomed. zoomFactor is inverse of the zoom level itself so that you can use it to scale things inversely to the map's zoom.
fill(d) - Given a data point, returns a colour string to fill that map segment.
labelText(d) - Given a data point, returns the string used to label that map segment.
Authors
- Nathan Hoad - hoad.nathan@abc.net.au
