2014-11-18 10:30 GMT-03:00 Offray Vladimir Luna Cárdenas <offray@riseup.net> :
Hi,
This Thursday and Saturday we will have a small workshop on data storytelling and I would like to present Pharo/Roassal to the people there as a tool for creating and sharing visualizations.
My idea is to use Playgrounds to make agile visualization and then share them using cloud sharing at stfx and etherpads. The maps I would like to make are similar to the ones that have colored countries [1][2], but using internal country geopolitical divisions. For the case of Colombia I would like to use the ones of [3], specifically something like [4] and use the same syntax of RTMetricMap inside the country.
[1] http://bit.ly/1yiedrE [2] http://bit.ly/1xTAQV0 [3] https://commons.wikimedia.org/wiki/User:Shadowxfox/Maps#Colombia [4] https://commons.wikimedia.org/wiki/File:Colombia_ departamentos_otros.svg
So my question is:
- There is any way to upload this SGV maps and treat them as the maps already in RTMetricMap, telling the names of the internal geopolitical divisions inside a Country and how to color them according to a value and make them zoomable?
- Where can I start to look to support this feature?
SVG is basically XML, so you can parse it like this: | xmlTree | xmlTree := (XMLDOMParser parseFileNamed: 'Argentina.svg') firstNode. xmlTree The coordinates of a map are in the SVG path description, and you can add them separately. For example if you download this file http://commons.wikimedia.org/wiki/File:USA_Counties_with_FIPS_and_names.svg and take the node with "Ulster, NY" you can render it this way: | view svg | view := RTView new. svg := (RTSVGPath new path: 'M 501.96598,97.8 L 502.15198,100.009 L 502.68298,101.739 L 502.88598,102.153 L 503.20498,104.028 L 502.29498,104.366 L 501.61098,104.502 L 501.02498,104.483 L 500.32998,104.231 L 499.33398,104.921 L 498.91498,104.299 L 497.86898,103.844 L 496.94598,103.415 L 497.13498,102.933 L 497.50398,102.086 L 497.69798,101.505 L 495.56698,100.824 L 494.24598,100.423 L 496.85998,97.791 L 498.36098,98.174 L 499.08798,98.084 L 500.56998,97.894 L 500.65098,96.89 L 501.06998,96.754 L 501.99798,97.146 L 501.96598,97.8'; fillColor: (Color r: 0.612 g: 0.488 b: 0.3 alpha: 1.0); scale: 5) element. view add: svg. view open There should be an easier way like using an SVG importer for Roassal, but that's all I have for now. Cheers, Hernán