I had some more fun playing around with DALL-E. It feels like the first time I used a word processor: it’s so easy to create something new. All I’m missing is the imagination.
Finally, another Fourth of July Parade!
While Suzi and Ashley picked plants to buy, I wandered with my camera, finding flowers2 Clearly, I needed to take pictures of the tags so I could create more descriptive captions. to capture.
- 1We’ve been there before.
- 2Clearly, I needed to take pictures of the tags so I could create more descriptive captions.
This last Saturday,1 Yeah, a week ago… we decided to head to Manzanita. We figured that with the nice weather, Cannon Beach was going to be crowded.2 At least, crowded according to Cannon Beach standards. Also, Jamison and I wanted to take some photos and Manzanita seemed as likely a place for that as anywhere. Suzi and I had been there recently, and I wanted to take another look.
So, off we3 Jamison, Suzi, and me in one car, Ashley, Kevin, Sebastian, and Mousse in another. They’d also decided it was a good beach day. headed to Manzanita. When we got there, it was windy and cold. While the others hunkered down behind a grassy dune with a great view of the ocean, Jamison and I headed north on the beach. I wanted to get closer to the hole in the cliff that I’d photographed before.
On the way, we had to navigate around three different streams across the beach. Because the beach isn’t that wide, at least, compared with Cannon Beach, it was simple to go to the upstream end and cross. When we got to the end of the sand, Jamison and I started making pictures.
On the way back to the group, we tried crossing the streams and their ocean ends, with varying amounts of success. In other words, one of my shoes got soaked. Oops!
We stuck around until the sun went down, taking more pictures as it did.
Another great day at the Oregon coast!
- 1Yeah, a week ago…
- 2At least, crowded according to Cannon Beach standards.
- 3Jamison, Suzi, and me in one car, Ashley, Kevin, Sebastian, and Mousse in another. They’d also decided it was a good beach day.
Inspired by recent events in Texas, I decided to create an SVG-format image of the lone star state flag. Compared with the US flag, it’s a fairly simple design, being:
A rectangle that: (1) has a width to length ratio of two to three; and (2) contains: (A) one blue vertical stripe that has a width equal to one-third the length of the flag; (B) two equal horizontal stripes, the upper stripe white, the lower stripe red, each having a length equal to two-thirds the length of the flag; and (C) one white, regular five-pointed star: (i) located in the center of the blue stripe; (ii) oriented so that one point faces upward; and (iii) sized so that the diameter of a circle passing through the five points of the star is equal to three-fourths the width of the blue stripe.Flag of Texas at Wikipedia.
Once again, I needed to make a star in SVG. Having forgotten how I did it last time and realizing I’d likely have scaling issues if I just cut and pasted, I decided I’d reinvent the wheel, and maybe make it better this time. Searching online, I found the ratio between the radii of the circles for the inner and outer vertices1Pentagram at Wolfram MathWorld. is 0.381965 and the formulas for them in polar coordinates using radians are fairly elegant.2Drawing radial shapes in D3.js.
I created a spreadsheet for calculating the vertices and converting them into cartesian coordinates. This simplified adding offsets later on when I decided to put the star into a
<symbol>. Fortunately, I made all the calculations dependent on a single scale factor, simplifying reducing the number of significant digits from four to three when I realized I didn’t need all that precision.
Once I had the flag working, I decided to hand-optimize, converting the colored rectangles into smaller
<path>s. I did the same with the star, but after running the resulting file through SVGOMG, I realized that its optimizer is still smarter than me, using relative coordinates when it resulted in a smaller dataset.
Here’s my code:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 533"> <path d="M0 0H800V533H0Z" fill="#fff" /> <path d="M0 267H800V533H0Z" fill="#bf0d3e" /> <path d="M0 0H267V533H0Z" fill="#00205b" /> <path d="M133 167,111 236H38L97 279,75 348,133 305,192 348,170 279,228 236H156Z" fill="#fff" /> </svg>
I find it easier to read than the fully optimized version from SVGOMG. Of course, there’s the Pocket Guide to Writing SVG if you need a reference.
Having made the lone star state flag, it wasn’t much more effort to make a one-star state flag. ;-)
You can download the optimized versions of both flags, here:
I also have the one-star version available as a png:
Same as for the Ukrainian flag, I release my Texas state flag files to the public domain to use as you wish, no attribution required.
- 1Pentagram at Wolfram MathWorld.
Creating a Ukraine flag in SVG format is quite straightforward.1I always use the Pocket Guide to Writing SVG when hand-crafting SVGs. Using 2:3 proportions2Ukraine at Flags of the World. and correct colors,3Flag of Ukraine on Wikipedia. I created a basic SVG using rectangles:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 3 2"> <rect x="0" y="0" width="3" height="1" fill="#0057b7" stroke-width="0px" /> <rect x="0" y="1" width="3" height="1" fill="#ffd700" stroke-width="0px" /> </svg>
I find using codepen.io to be the easiest place to do this, as it shows the resulting graphic as I work.
Next, I cut and pasted this into SVGOMG for optimizing the
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3 2"> <path fill="#0057b7" d="M0 0h3v1H0z"/> <path fill="gold" d="M0 1h3v1H0z"/> </svg>
SVGOMG also provided a shorter designation for the color gold and removed all whitespace. Filesize comparisons are below. Only 165 bytes uncompressed is quite small!4By way of comparison, the png format Ukraine flag on Wikipedia is 2KB. My US flag SVG file is 738 bytes, compressed.
This past Monday afternoon, Suzi and I made a quick escape to Cannon Beach to watch the sunset. We arrived with less than an hour to spare and parked at the beach end of Second Ave. Barely on the sand, I noted we wouldn’t want to walk very far. After all, those clouds over the ocean indicated rain. Almost immediately, it started showering on us. That is, it was just like we were standing in a shower, small drops coming down hard, at an angle. We were going to be soaked and soon.
After retreating to the car, we decided to drive south to Tolovana Beach. Worst case, we could sit in the car and watch the sun go down. When we arrived, there was only a light mist. So we walked out to the beach, took a few pictures, then headed back to the car because of the mist and the cold. We warmed up in the car and rinsed and repeated a few times.
Finally, once again warming up in the car, we decided to drive back north a bit to find a different view of the Rock and the sun. This time, we stuck it out until the sun went down.
Another great day at the beach!
Melissa recently bought a dual leash so one of us could take both Oakley and Gilligan on a walk. We have been amazed at how well it works.
Now, because reasons, we have all three granddogs at our house for a short time. I decided to try taking all three dogs on a walk by myself.
For the last couple of days, I’ve had great success.1I even have a hand free to take a picture or pick up messes. I don’t know whether passers-by are thinking, “I didn’t know we had a dog-walking service in our neighborhood,” “I guess that’s better than being a greeter at Walmart,” or “What a lucky guy to have three beautiful, well-behaved doggies.”
I’m going with that last one.
- 1I even have a hand free to take a picture or pick up messes.
After a text this morning warning of a potential tsunami on the Oregon coast, I went to KGW8’s Cannon Beach Cam. I watched from about 8:35 to 8:50 am to see what I could see, but didn’t notice anything out of the ordinary.
That’s good news.1Another win for Betteridge’s law of headlines.
- 1Another win for Betteridge’s law of headlines.