{"id":22961,"date":"2019-03-06T10:00:39","date_gmt":"2019-03-06T15:00:39","guid":{"rendered":"https:\/\/blogs.solidworks.com\/tech\/?p=22961"},"modified":"2019-03-06T09:43:29","modified_gmt":"2019-03-06T14:43:29","slug":"interactive-web-content-from-solidworks-composer","status":"publish","type":"post","link":"https:\/\/blogs.solidworks.com\/tech\/2019\/03\/interactive-web-content-from-solidworks-composer.html","title":{"rendered":"Interactive Web Content from SOLIDWORKS Composer"},"content":{"rendered":"

Finding a replacement part can often be a hassle, even for the simplest of products.\u00a0 Calling up customer service and trying to decipher exactly what widget you are attempting to order can be next to impossible without having the unique SKU or Part Number needed.\u00a0 Seriously, who has that on hand?!\u00a0 Luckily, SOLIDWORKS Composer has an easy way to generate interactive 2D web content that can help probe into assemblies to perfectly identify these parts\u00a0(check out these examples).<\/a>\u00a0 This blog post will walk you through the four steps to create these interactive images from your CAD data.<\/p>\n

\"\"<\/a><\/p>\n

 <\/p>\n

The process of creating Interactive content really comes down to 4 simple steps:<\/p>\n

    \n
  1. Create Views<\/strong><\/li>\n
  2. Create Links<\/strong><\/li>\n
  3. Export Images as SVG<\/strong><\/li>\n
  4. Embed to HTML<\/strong><\/li>\n<\/ol>\n

    <\/h4>\n

    STEP ONE: CREATE VIEWS<\/h1>\n

    Let\u2019s take a look of these for steps a little closer starting with capturing your interactive images in SOLIDWORKS Composer. Hot spots can be really handy for selecting sub-assemblies from the top level assembly that will be the starting point. Determine how you plan to break up your assemblies to easily navigate.\u00a0 \u00a0Each hotspot can have its own unique color by locating the hotspot and overriding the default color option. I also recommend renaming these hotspots to be descriptive of the sub-assembly, these callouts are visible on the tooltip when hovering over.<\/p>\n

    \"\"
    Assigning Sub-assembly Hotspots<\/figcaption><\/figure>\n
    \"\"
    Hotspot Properties<\/figcaption><\/figure>\n

     <\/p>\n

     <\/p>\n

    I selected the battery pack from this assembly and create another view (the links to connect the views will be added in the second step so you don’t have to worry about that right now).\u00a0 Using the transform tools, it\u2019s easy to create an exploded view.\u00a0 Often with more simplified sub-assemblies this will be enough to address finding the appropriate part, especially with an interactive Bill of Materials created. It’s a simple process so might as well attach one to each exploded view you create.<\/p>\n

     <\/p>\n

    \"\"<\/p>\n

    Creating a BOM from an Exploded View<\/h3>\n
      \n
    1. Create a BOM from selections\n