Jump to content
GreenSock

mishunov

Hosted DrawSVGPlugin doesn't seem to work

Recommended Posts

There seems to be a problem with DrawSVGPlugin for me: I can not make it work when I try with the hosted file and not within Codepen. I am 

ShockinglyGreen member so there is no issue with this. The problem is that I run the same code against Codepen-specific version and against the hosted version of the script. You can see the result yourself:

 

Codepen-specific (where lines get drawn): 

See the Pen Gverwq by mishunov (@mishunov) on CodePen

And here is the other version with the file being self-hosted on a server: 

See the Pen MvxpqN by mishunov (@mishunov) on CodePen

 

As you can see in this second case, the lines do not get drawn and the whole contour shows up instantly

 

What do I miss here?

Thank you.

Link to comment
Share on other sites

Hi @mishunov :)

 

Welcome to the forum and thanks for joining Club GreenSock.

 

That looks like a problem with CodePen and http vs https. If you look at the pen settings JavaScript, you'll see this error.

 

iI5M47e.png

 

For CodePen work, it's best to use the CodePen safe versions of Club plugins. Here's a pen that loads all of them:

 

See the Pen OPqpRJ by GreenSock (@GreenSock) on CodePen

It's also best to use the latest version of TweenMax (1.20.2) rather than an older version. 

 

Hopefully this helps. Happy tweening and welcome aboard.

:)

  • Like 3
Link to comment
Share on other sites

Hello, @PointC

 

Thanks for pointing out to this HTTPS/HTTP issue. I was aware of that but didn't pay enough attention to it since it doesn't work locally for me as well. Is it correct to say that DrawSVGPlugin work only over HTTPS or (possibly) localhost?

 

The reason I'm asking is because I am running the dev site locally at http://127.0.0.1:8081 and for the DrawSVGPlugin file hosted on the same site it does not work either. Is there any way I can develop with this plugin locally on HTTP? Or I should set up local dev server to serve the site over https? Also what do I do for production if my site is not served over HTTPS?

 

If this is the case this should be in the documentation I believe since this is very not intuitively clear since, for example, MorphSVG works great over http. It also takes a lot of time to come up to this conclusion.

Link to comment
Share on other sites

hmmm... that shouldn't be an issue. I use that plugin locally and on non-secure sites all the time with no problems. If morph works for you, I'm not sure why DrawSVG would be causing trouble.

 

You are using the version from your download dashboard and not the one from CodePen, right? 

 

 

  • Like 1
Link to comment
Share on other sites

Just now, PointC said:

You are using the version from your download dashboard and not the one from CodePen, right? 

 

Exactly. Have re-downloaded everything just now. MorphSVG works, DrawSVG doesn't :( Serving the local site from https now without any success still… should be something really stupid here apparently…

 

Anyway, thanks for the prompt response. Will try to dig deeper and will come back if things still don't work after some attempts.

Link to comment
Share on other sites

@mishunov

 

Look at my response. It's on your end. Google this.

net::ERR_INSECURE_RESPONSE

 

Link to comment
Share on other sites

4 minutes ago, OSUblake said:

@mishunov

 

Look at my response. It's on your end. Google this.


net::ERR_INSECURE_RESPONSE

 

 

Hey, OSUblake! Thanks for your response but I have seen it, of course, and it is related to the same issue pointed out by PointC. It's the same and is not really "my end" but the issue with mixing HTTP and HTTPS resources on Codepen. But the problem is that I can not get it working locally either and there are no console errors and no mixed protocols here.

Link to comment
Share on other sites

You may want to see what's loading. Check out this post by @Carl for a handy way to see all the plugins being loaded by the page:

 

Happy tweening.

:)

  • Like 2
Link to comment
Share on other sites

Thanks a lot for referencing that snipper, PointC! With that it's clear that DrawSVGPlugin is not loaded for some arbitrary reason. Though MorphSVG is there indeed. Ok, this give me some food for thought. Thank you :)

Link to comment
Share on other sites

UPDATE: Thanks for all the answers, guys. I found the problem. It was… I loaded the script in the wrong way :-P Since I am working with Polymer and include files with HTML imports, I have messed up inclusion of the regular scripts like GSAP plugins. Fixed it now and it works like a charm! Thank you very much :)

  • Like 3
Link to comment
Share on other sites

Thanks for letting us know you found the problem.

 

If you have additional GSAP questions, we're always here to help. Thanks again for your membership. Happy tweening.

:)

  • Like 2
Link to comment
Share on other sites

Hi @mishunov

 

Glad you got it working!

 

And maybe I wasn't be clear. By your end, I was talking about your host. I wasn't even looking at CodePen. I was running your original demo locally.

 

Something isn't configured correctly. Using https for your script blocks it because it's an insecure connection. Using http results in a 404

 

Try accessing these links directly. I'll remove them in a few so other people won't snag them.

...

 

 

  • Like 2
Link to comment
Share on other sites

Right, OSUblake, that's exactly the reason it doesn't work on Codepen. But I've removed those demos so that they do not confuse anybody :)

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×