Comments (6)
I also find that the detailview works normally only when I set padding = 'vaild'. If I change padding to 'same' then detailview of existing convolution nodes will lose the lines, bais nodes and animation of former nodes. How can I fix this problem?
from cnn-explainer.
Nice! By detail view, are you referring to the intermediate convolution process at a layer-level? If so, you also need to change the intermediate layer drawing code.
You can check out the code here:
cnn-explainer/src/overview/intermediate-draw.js
Lines 393 to 409 in b9c1759
cnn-explainer/src/overview/intermediate-draw.js
Lines 1183 to 1196 in b9c1759
cnn-explainer/src/overview/Overview.svelte
Lines 894 to 903 in b9c1759
The detailedViewAbsCoords
you mentioned controls where to put the interactive math formula view (visualizing how convolution works on one matrix). We refer to the formula view as "detailed view" in the code.
Good luck, and keep us updated! I would leave the issue open for now.
from cnn-explainer.
Thanks for your reply, Im now getting deeper and deeper understanding about this program.
According to your suggestion I copied and changed some codes for the new added convolution layers in intermediate-draw.js and overview.svelte but the intermediate view of those layers still didn't work.
for example I changed the const drawIntermediateLayer
of conv_2_2(export const drawConv4
) which makes it the same as conv_2_1(export const drawConv3
) and I copied those codes for conv_3_1(export const drawConv5
), and finally I copied the original codes of conv_2_2(export const drawConv4
) for conv_3_2(export const drawConv6
). I was just going to see if this works, unfortunately it didn't.
I'm thinking if there are some limits to the size of the display area, which restrict the intermediate view of the new added layers ? Is there anyway I can change the size of the display area?
from cnn-explainer.
Did you get any error messages? Or nothing was shown on the screen? Flipping the code for drawing intermediate layers of these conv layers can be tricky, because animations work differently for each layer. For example, when users expand the conv_1_1, all layers are pushed to the right. However, when users expand the conv_2_1, only half of the layers are pushed to the left. You would need to manually change these animation definitions within drawnConv4
for example.
For the display area, CNN Explainer dynamically sets the SVG width based on the viewport width. Therefore, the layers are more spread out on wider monitors and more compact on smaller monitors. You can see the code below. The size of the intermediate layer is controlled within each drawing functions drawConv3
(with key variables such as leftX
, targetX
, and rightStart
; good to check out the argument list of drawIntermediateLayer()
).
cnn-explainer/src/overview/Overview.svelte
Lines 1052 to 1062 in 2b75d28
cnn-explainer/src/overview/intermediate-draw.js
Lines 393 to 408 in b9c1759
from cnn-explainer.
Hi @xiaohk, your advice is super helpful! Now I almost solve my problem but still have some issues to deal with.
According to your lastest suggestion I did some change of the parameters of all drawConv
parts to adjust to my model and I found that the intermediate view of new added layers still didn't work but I was sure that I was on the right direction. Today when I checked Overview.svelte
I found the part of import { } from './intermediate-draw.js'
only have four drawConv
so I added the other two and It works! Now my conv_3_1 and conv_3_2 have the intermediate view too!
from cnn-explainer.
@baobobby Congrats!! ٩( ᐛ )و It looks very nice! Thanks for adding your new layers and share your work here. It would be very helpful for future users who want do customize the tiny VGG architecture! I will close the issue now. Let us know if you have more questions.
from cnn-explainer.
Related Issues (20)
- run with static ip HOT 1
- about retraining cnn explainer HOT 2
- run error HOT 2
- ReLu function max(0,a) gives 0 HOT 3
- detail view problem HOT 1
- Update the number of layer HOT 1
- question about changing parameter 'height' HOT 1
- error in npm run dev HOT 1
- vue中无法运行 HOT 2
- 更换图片重新训练后却没有变化 HOT 3
- Why is the page empty HOT 2
- How can i change the input_image_size ? HOT 5
- How we can explain neuron if we do use cnn? HOT 1
- Would be cool to have an explainer for an object detection pipeline as well HOT 1
- The explainer won't show up in the browser HOT 4
- HTTP ERROR 403 HOT 5
- [Feature] Shipping in a docker container HOT 1
- my interface is also blank HOT 4
- a suggestion for Deployment on server HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from cnn-explainer.