llgcode / draw2d

2D rendering for different output (raster, pdf, svg)
BSD 2-Clause "Simplified" License
1.09k stars 105 forks source link

How can I draw a shape with an inner hole ? #158

Closed sotex closed 4 years ago

sotex commented 4 years ago

I need to draw some shapes with inner holes. I don't know if there is a more convenient way. Because I want to draw multiple such shapes on top of each other.

图片

The method I currently use is: 1、Create a new canvas(Transparent background), Draw upper shell polygon. 2、Draw inner holes in transparent colors 3、Draw the contents of the new canvas onto the old canvas

Thanks.

llgcode commented 4 years ago

Hi @sotex, I think you 'll find what you want in this sample: https://github.com/llgcode/draw2d/wiki/Samples#test-fill-style regards Laurent

sotex commented 4 years ago

Hi @llgcode, thank for your help. I have implemented this basic function and your work is really great!

I have a little question, and I hope to get your guidance. This is the graphic I draw on the geojson.io website

geojson.io

Data are as follows:

{"type":"FeatureCollection","features":[{"type":"Feature","properties":{"stroke":"#0f2f9b","stroke-width":2,"stroke-opacity":1,"fill":"#a90501","fill-opacity":0.5},"geometry":{"type":"Polygon","coordinates":[[[100.2392578125,34.34343606848294],[97.998046875,30.41078179084589],[101.22802734375,27.702983735525862],[108.08349609375,28.844673680771795],[110.36865234374999,34.66935854524543],[112.8515625,35.209721645221386],[112.47802734375,31.89621446335144],[117.0703125,30.240086360983426],[117.57568359374999,34.939985151560435],[112.236328125,38.35888785866677],[100.2392578125,34.34343606848294]],[[101.05224609374999,32.02670629333614],[102.72216796875,33.394759218577995],[104.94140625,32.11980111179328],[103.38134765625,31.70947636001935],[103.1396484375,30.259067203213018],[101.05224609374999,32.02670629333614]],[[106.962890625,35.263561862152095],[110.7861328125,36.756490329505176],[111.09374999999999,36.27970720524017],[107.46826171874999,34.74161249883172],[106.962890625,35.263561862152095]]]}},{"type":"Feature","properties":{"stroke":"#ffffff","stroke-width":2,"stroke-opacity":1,"fill":"#ffff00","fill-opacity":0.5},"geometry":{"type":"Polygon","coordinates":[[[113.97216796875,35.99578538642032],[113.9501953125,35.22767235493586],[115.81787109375,34.63320791137959],[115.55419921875,31.522361470421437],[116.23535156249999,31.409912194070973],[116.4111328125,34.88593094075317],[113.97216796875,35.99578538642032]]]}}]}

This is the result I draw following the wiki.

draw2d

I think it is better to handle the overlay of the newly filled part with the original color, rather than simply covering it. But I want to know if I can control simple coverage? Tanks.

llgcode commented 4 years ago

HI @sotex , great and thank you :-), this library is working thanks to Nigel Tao from Google that wrote the freetype lib behind the wrapper I wrote. You have to be aware of the new API he wrote: https://github.com/golang/image. There's also other alternatives that work well too. To answer your question, not sure what do you mean by controlling simple coverage. you can control the transparency with alpha part of the color. regards

sotex commented 4 years ago

HI @llgcode , Thanks to you and other open source practitioners for your great contributions, I have learned a lot. My English is not good, thank you for your patient reply.