将 .ai 或 .svg 文件放到网络上，无需 Flash
场景如下：我有一个 800kb 的 Adobe Illustrator 文件——它是一个购物中心的自上而下的图表，每个单独的商店都标有一些文本。显示平方英尺、可用性和数量的元数据。
我如何以交互方式将其放在网络上？我可以简单地将 PDF 导出到网络，但这并不是一个很好的体验。我希望能够放大并查看详细信息（这是一个大型购物中心），并且也许能够单击发送有关单个空间的电子邮件或消息以对其进行查询。
如果是 4-8 年前，自然的答案当然是 Macromedia Adobe Flash！但我们现在正处于一个人们希望在手机上看到这些东西的时代。
是否有可能以一种相当有效的方式做到这一点？我尝试使用 svgweb 加载文件，但我的浏览器（任何浏览器）都停止运行，我认为是因为文件的大小。
跨浏览器、可缩放和交互式地图的示例有哪些？
人们在该领域使用哪些工具或库取得了成功？感觉 GIS 工具在这里是值得的，但可能有点矫枉过正。
So here's the scenario: I have an 800kb Adobe Illustrator file -- it's a topdown diagram of of a mall, with each individual shop marked with some text. Metadata showing square footage, availability, a number.
How would I put this on the web in a way that's interactive? I can simply export a PDF to the web, but that's not a great experience. I'd like to be able to zoom in and see detail (it's a big mall) and maybe be able to click to send an email or a message about an individual space to make an inquiry about it.
If it were 4-8 years ago, the natural answer is Macromedia Adobe Flash of course! But we're now in an era where people want to see these things on their phones.
Is it possible to do this in a way that works reasonably well? I tried loading the file using svgweb, but my browser (any browser) grinds to a halt, I think because of the the size of the file.
What are examples of maps that are cross browser, zoomable, and interactive?
What tools or libraries do people have success with in this area? it feels like GIS tools would be worthwhile here but might be overkill.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
如果您想采用类似于谷歌地图的平铺方法，请查看polymaps。
如果您的 svg 很大，那么以某种方式分割它可能是个好主意，可以按细节级别/图层，也可以按图块。详细程度可以通过 CSS 媒体查询，但请注意，这本身并不会使文件大小变小。然而，它应该对外观和外观产生积极的影响。感觉。
如果您想要一些简单的缩放和平移控件，这些控件应该在所有支持 svg 的浏览器中工作 这是一个例子。
If you want to go for a tiled approach similar to google maps, check out polymaps.
If your svg is big then it's probably a good idea to split it somehow, either by level-of-detail / layers, or by tiles. Level of detail can be done with CSS media-queries for example, but note that that by itself doesn't make the filesize smaller. It should however have a positive effect on the look & feel.
If you want some simple zoom&pan controls that should work in all svg-capable browsers here's an example of that.
Adobe Illustrator 可以导出为 SVG，这可能值得探索。
另外，您是否考虑过光栅化并将图像切割成图块？你可以做一些类似谷歌地图的东西。
Adobe Illustrator can export to SVG which might be worth exploring.
Also, have you considered rasterizing and cutting the image into tiles? You could make something that's Google Maps-like.