Recent Posts

Weekly Report 12/21


2024-12-21 Daily Life

Recently I am interested in software engineering and drawing.

About Software Engineering

We have a weekly meeting where we are expected to give our opinions on improving software design.
Although I majored in computer science in the university, it is very different from software engineering, which is less mathematical and theoretical but more practical. It is finally time for me to study software engineering in depth! (too late!)
So, I started by reading famous books such as:

“Design Patterns: Elements of Reusable Object-Oriented Software”
“The Pragmatic Programmer: From Journeyman to Master”

While I know that reading these books in English will improve my English level, I bought the Japanese version. It is more important to shorten the study time.

About Drawing

Drawing frees me. A breakup gave me more than enough stress and learn in the past month. I needed to think about my future and what I desire for my life. And I realized that looking at paintings in museums and drawing pictures and cartoons reduces stress and comforts me. This is not something that just started recently, it’s been the same since I was a child.

I have a habit of imagining what others want and trying to fit in, and I’m excessively afraid of hurting their feelings, so it’s hard for them to understand me. Art and stories are the only way I can express myself without any restrictions. I I decided to devote myself to this until I felt satisfied and confident in myself.

Other little things: I’m thinking about orthodontics again.

Next week plan

At the top of my to-do list is a year-end cleanup. I even take a day off on Christmas Eve to do it!
My company’s end-of-year all-hands meeting is going to be a great time. I need to send a Christmas cards for my friend and my grandmother. And of course I will read books mentioned above.

How to embed HTML into a web page without using “iframe


2024-08-12 JavaScript PHP Web

While coding my personal website, I ran into a problem: I want to create a modal window with an “iframe” tag, but Google Translate does not support text in the iframe. So I tried to embed another HTML file in index.html with JavaScript or PHP.

GOAL

The goal today is to embed sub.html in index.html without using iframe tags so that Google Translate will work for the embedded text.

Below is how to embed the code in an iframe tag.

<iframe src="sub.html"></iframe>

Environment

PHP8.3.8
Latest Google Chrome (Version 127.0.6533.90)

Method

Method1: Using php include function

<?php include 'sub.html'; ?>
//<?php include('sub.html'); ?> also works

Change index.html into index.php to use PHP function in index file.
Or you can use html as PHP by using “AddType” in .htaccess. Reference: Parse HTML as PHP using HTACCESS File

Method2: JQuery .load() in JavaScript

<div id="frame-content"></div>

<!-- need to read jQuery -->
<script src="jquery.min.js"></script>

<script>
    $("#frame-content").load('sub.html');
</script>

Trouble Shooting

Opening index.html in a local environment causes a CROS policy error as below. For correct results, we must use a web server or a local HTTP server.

Access to XMLHttpRequest at 'file:///C:/.../sub.html' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.

Reference: How do you set up a local testing server?

How to Bake Normal Map in Blender


2022-05-30 Blender

GOAL

Today’s goal is to bake normal, i.e., generate a normal map from an uneven mesh in Blender.

In my case, I baked normal map from high-level model and apply it into the low-level model as below.

Environment

Blender2.83(LTS)
Windows 10

Method

First generate add image to bake normal. You can create an Image from Shader Editor or Image Editor. And select the added image on the Shader Editor.

Open “Bake” tab from Cycles Render Properties and click “Bake” button. You can choose either “Tangent” space or “Object” space you like.

Then save the baked image from Image Editor.

Result

Apply result image as a normal map. For example, we can connect nodes as below in the cycle renderer.

Shader Editor

The following is rendered result. It looks well.

Categories

AfterEffects Algorithm Artificial Intelligence Blender C++ Computer Graphics Computer Science Daily Life DataAnalytics Event Game ImageProcessing JavaScript Kotlin mathematics Maya PHP Python SoftwareEngineering Tips Today's paper Tools TroubleShooting Unity Visual Sudio Web Windows WordPress 未分類