繰り返しのないランダムパターンで画像を生成する

Question

私はしばらくの間、特別なランダムパターンを作成しようとしていました。例えば、このようなランダムな黒い点、：

https://picload.org/thumbnail/riogwpll/pattern2.jpg

はしかし、私は、約100,000ポイント/円とはるかに大きい画像を必要としています。しかし、原則として、いくつかのMBを持つSVGは、Inkscapeなどで開かせるには大きすぎます。各円は個別に描画されるためです。これがどうやって実現できるか考えてみれば、ファイルサイズは小さくなります。私はすでにパターンで何かを試した。問題は、それが本当にランダムで非繰り返しのパターンでなければならないということです。

それは、それはまた次のようになりますドットでこれを実行する必要はありません：[ここに画像の説明を入力] アイデア/提案のために[1] https://picload.org/thumbnail/riogwwdr/pattern1.jpg

を、私は感謝しています。

Answer 1

これはあなたが後にいるようなものですか？

1. <feTurbulence baseFrequency=".1" numOctaves="1" seed="42" />は、いくつかのランダムノイズを生成します。この仕組み

   <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="600"> 
    
       <defs> 
    
       <filter id="dots" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%" color-interpolation-filters="sRGB"> 
    
        <feTurbulence baseFrequency=".1" numOctaves="1" seed="42" /> 
    
        <feColorMatrix type="saturate" values="0"/> 
    
        <feGaussianBlur result="blur" stdDeviation="2" /> 
    
        <feComponentTransfer> 
    
        <feFuncA type="discrete" tableValues="0 1 1 1 1"/> 
    
        </feComponentTransfer> 
    
       </filter> 
    
       </defs> 
    
       <rect x="0" y="0" width="600" height="600" style="fill:#888; stroke:#bbd; stroke-width:2px; filter: url(#dots)" /> 
    
   </svg>

   。毎回異なるパターンが必要な場合は、seed属性を削除します。

2. <feColorMatrix type="saturate" values="0"/>は、ノイズをグレースケールに変換します。
3. <feGaussianBlur result="blur" stdDeviation="2" />は、ドットが少しでも合うようにノイズパターンをぼかします。この値を試して、「くすみ」を変えてください。
4. <feComponentTransfer>グレー値を黒または白に設定します。