回答編集履歴

1

追記:第二案投稿

2018/03/20 12:47

投稿

退会済みユーザー
test CHANGED
@@ -101,3 +101,209 @@
101
101
 
102
102
 
103
103
  ```
104
+
105
+
106
+
107
+ 追記:
108
+
109
+ 1)の方も、こんなでいいのかなぁ。
110
+
111
+ ```Processing
112
+
113
+ void setup() {
114
+
115
+ size(800, 600);
116
+
117
+ Font=createFont("メイリオ", 48);
118
+
119
+ font_size_large = height/30;
120
+
121
+ }
122
+
123
+
124
+
125
+ PFont Font;
126
+
127
+ float font_size_large;
128
+
129
+ float kvc = 0;
130
+
131
+
132
+
133
+ void draw() {
134
+
135
+ speed_region();
136
+
137
+ }
138
+
139
+
140
+
141
+ void speed_region()
142
+
143
+ {
144
+
145
+ float mask_width = width / 8.0;
146
+
147
+ float mask_height = height / 7.5;
148
+
149
+ int spd_label_max = 1000; //速度の最大表示はMAX1000 [kt]
150
+
151
+ int spd_delta = 20;//速度の表示間隔は20 [kt]
152
+
153
+ int spd_num = spd_label_max / spd_delta;
154
+
155
+ float spd_scale_length = height * 0.35;
156
+
157
+ float spd_num_distance = spd_scale_length / spd_num;
158
+
159
+ float spd_num_reach = mask_width * 0.35;
160
+
161
+ float spd_scale_main_reach = mask_width * 0.20;
162
+
163
+ float spd_scale_sub_reach = mask_width * 0.10;
164
+
165
+ float spd_num_exist;
166
+
167
+ float spd_scale_sub_exist;
168
+
169
+ float R = height / 50;
170
+
171
+
172
+
173
+ PGraphics pg=createGraphics((int)(mask_width+R/2), height);
174
+
175
+
176
+
177
+ pg.beginDraw();
178
+
179
+ pg.background(255, 0, 0);
180
+
181
+ pg.textFont(Font, font_size_large);
182
+
183
+ pg.rectMode(CORNER);
184
+
185
+ pg.noStroke();
186
+
187
+ pg.fill(200);
188
+
189
+ pg.stroke(0, 255, 0);
190
+
191
+ pg.rect(0,0,mask_width, height);
192
+
193
+ pg.translate(mask_width, height/2);
194
+
195
+ pg.fill(0);
196
+
197
+ pg.textAlign(RIGHT);
198
+
199
+ //速度計表示
200
+
201
+ for (int i = 0; i <= spd_label_max; i += spd_delta)
202
+
203
+ {
204
+
205
+ float y = map(kvc, 0, 1000, 0, spd_scale_length * ((spd_label_max / spd_delta) - 30));
206
+
207
+
208
+
209
+ spd_num_exist = -(i * spd_num_distance) + y;
210
+
211
+ spd_scale_sub_exist = spd_num_exist - spd_num_distance * (spd_label_max/100);
212
+
213
+ pg.fill(0, 255, 0);
214
+
215
+ pg.text(i, -spd_num_reach, spd_num_exist + font_size_large * 0.3);
216
+
217
+ pg.line(0, spd_num_exist, -spd_scale_main_reach, spd_num_exist);
218
+
219
+ pg.line(0, spd_scale_sub_exist, -spd_scale_sub_reach, spd_scale_sub_exist);
220
+
221
+ }
222
+
223
+ pg.fill(0, 255, 0);
224
+
225
+ pg.beginShape();
226
+
227
+ pg.scale(-1, 1);
228
+
229
+ for (int i = 0; i < 3; i++) {
230
+
231
+ pg.vertex(R*cos(radians(360*i/3)), R*sin(radians(360*i/3)));
232
+
233
+ }
234
+
235
+ pg.endShape(CLOSE);
236
+
237
+ pg.fill(255,0,0);
238
+
239
+ pg.resetMatrix();
240
+
241
+ pg.beginShape();//くり抜くところを描画
242
+
243
+ pg.vertex(0, -height / 15 + height / 2);
244
+
245
+ pg.vertex(mask_width / 1.25, -height / 15 + height / 2);
246
+
247
+ pg.vertex(mask_width / 1.25, -height / 45 + height / 2);
248
+
249
+ pg.vertex(mask_width / 1.10, height / 2);
250
+
251
+ pg.vertex(mask_width / 1.25, height / 45 + height / 2);
252
+
253
+ pg.vertex(mask_width / 1.25, height / 15 + height / 2);
254
+
255
+ pg.vertex(0, height / 15 + height / 2);
256
+
257
+ pg.endShape(CLOSE);
258
+
259
+ pg.loadPixels();
260
+
261
+ for(int i=0;i<pg.pixels.length;i++){
262
+
263
+ if(red(pg.pixels[i])==255){
264
+
265
+ pg.pixels[i]=color(0,0,0,0);
266
+
267
+ }
268
+
269
+ }
270
+
271
+ pg.updatePixels();
272
+
273
+ pg.endDraw();
274
+
275
+ background(0, 200, 200);
276
+
277
+ //マスクの下のラベルを描く
278
+
279
+ translate(0,height/2);
280
+
281
+ fill(0);
282
+
283
+ rect(0,-height/15,mask_width,height*2/15);
284
+
285
+ fill(255);
286
+
287
+ textAlign(RIGHT,BOTTOM);
288
+
289
+ textFont(Font, font_size_large*2);
290
+
291
+ text("123",mask_width/1.25,0);
292
+
293
+ text("456",mask_width/1.25,height/15);
294
+
295
+ text("456",mask_width/1.25,height*2/15);
296
+
297
+
298
+
299
+
300
+
301
+ resetMatrix();
302
+
303
+ image(pg, 0, 0);//速度計マスク(?)を被せる
304
+
305
+ }
306
+
307
+ ```
308
+
309
+ 普通の描画では透明度をつけても、何かを描いた上から描くと下に描いてあるものが透過して見えるだけなので、PGraphicsに描いて、結果の一部の色を透過色に置き換えてやる、なんていうことをやっているわけですが。