Trouble Creating Custom Chart from Stadium Map SVG

Hello,

I am having trouble importing an SVG file into a custom chart *properly*. We are trying to get a stadium map down to the seat detail and am not having any luck getting the stadium map into DOMO. I am NOT a web dev expert by any means and this is my first time using a SVG file so any assistance/direction is greatly appreciated.

I am also attaching the SVG file please feel free to make any updates or suggestions.

Thanks in advance,

Nick

Indianapolis Colts NFL

Comments

user008949

Attached is the SVG code

SeatBySeatHeatmap.zip

GrantSmith

Hi @user008949

Can you expand more on how your SVG isn't working properly? Are you getting an error? Is the data not displaying correctly? What is the exact issue with the SVG file?

GrantSmith

I took a look at your SVG file and it appears that the bounding areas that were defined are well outside of the actual stadium image itself. The image goes between roughly 400 and 1300 wide (x) and 0 and 800 tall (y). Most of the locations of the sections I've seen are well in the 8000 ranges (x) which is outside of your stadium. You'll want to make sure your regions / defined areas are in the correct location overlaying the respective location on the stadium image itself.

user008949

Grant,

Thanks for the response. I do not know exactly what is wrong with the SVG and that is why i'm reaching out on here. But when I open the file locally I can see the image I want but when I upload to domo it is not picking it up (see below picture). I believe the data is correct and it's just a simple issue but I am not familiar with this process.

Thanks again!!

user008949

Interesting, thank you for your feedback. Do you have a suggested easy solution other then manually updating these coordinates? I am not familiar with this process.

Thanks again!

Nick

jaeW_at_Onyx

So... takes a little digging ...

an SVG is just a text file. try opening your file in a text editor.

It's hard to read but the first thing you'll notice is the embedded URL to a 'background image.'

https://mapsapi.tmol.io/maps/geometry/image/16/57/165736.

That background image is the vector of your actual map. IF you take THAT image and load it into Domo you get the following screenshot.

but that's not what you want. you want each SEAT.

If you go back to your originally uploaded file, each seat is actually just a circle overlaid on top of hte SVG:

</g>

Short answer is ... i don't know if it's possible to get what you want without some extensive work.

https://knowledge.domo.com/Visualize/Adding_Cards_to_Domo/KPI_Cards/Building_Each_Chart_Type/Custom_Charts

if you look at the sample provided in the kb link it tells you what your SVG needs to be...i'm not sure where you got this SVG file from, but it looks like you'd have to do a healthy amount of work to get it into the right shape if you want to light up each individual seat.

What you can do with the svgs you have, is map your ticket sales to the regions in the background SVG and use a custom grouping... so you could say

"end zone color" is 100% full or 25% full.

MarkSnodgrass

I know the Utah Jazz did what you are doing about a year ago. They briefly showed at DP19 and then on a Domo Voices spotlight webinar. It is tedious work and I'm guessing they hired Domo to do the detail work.

@jaeW_at_Onyx and @GrantSmith are both right. You need to correct your SVG file. You can do this with Adobe Illustrator or Inkscape (there are others, but these are the two that I have used). You would then create a "region" on every seat and label it according to your seat map or however your dataset would line up with it.

The Utah Jazz were able to do a lot of interesting analysis with it. I would see if your CSM could set up a meeting with them to talk about their process, or at least track down the DP19 and Domo Voices recordings for you to watch.

Quick Links

Find more posts tagged with

Heatmap

Other Categories

Product Ideas
Have a Domo product enhancement idea? Submit or upvote on ideas in the Ideas Exchange.
Ideas Exchange
Suggest & vote on new features you would like to see implemented in the Domo Product.
Data Connections
Ask questions about Connectors, Workbench, Cloud Amplifier and get best practices from Domo peers
Connectors
Connectors, Custom Connectors, Writeback
Workbench
Ask questions about Workbench, a secure, client-side solution for uploading your on-premise data to Domo.
Cloud Integrations
Ask questions about Cloud Integrations and Federated Data connection to your data warehouse or lake.
Data & ETL
Ask questions about Magic ETL, SQL DataFlows, DataFusion, Dataset Views and get best practices from Domo peers
Magic ETL
Ask Magic ETL questions and get answers from Domo peers
SQL DataFlows
Ask SQL DataFlow questions and get answers from Domo peers
Datasets
Ask DataFusion and Dataset Views questions and get answers from Domo peers
Visualize & Apps
Ask questions about Beast Mode, Cards, Charting, Dashboards, Stories, Variables and get best practices from Domo peers
Dashboards
Ask Cards, Dashboards, and Stories questions and get answers from Domo peers
App Studio
Ask questions about building apps in App Studio.
Pro-code Components
Ask questions about pro-code components and Domo Bricks and get answers from Domo peers.
Charting & Analyzer
Ask questions about charting and Analyzer and get answers from Domo peers.
Calculations & Variables (Beast Mode)
Ask questions about using calculated fields and Variables (Beast Modes) in Analyzer.
AI & Data science
Ask questions about DomoAI and get answers from Domo peers.
Domo AI & AI Chat
Ask questions about AI Chat and AI assistants.
Managing AI
Ask questions about managing AI with AI Playground, AI projects, AI models, and more.
Jupyter Workspaces
Ask questions about Jupyter Workspaces, Notebooks, and file share.
Automate
Ask questions about App Framework, Workflows, Domo Bricks, Domo Developer, API and get best practices from Domo peers
Workflows
Ask questions about Task Center, building automations with Domo Workflows, and executing JavaScript or Python code with Code Engine.
Alerts
Ask questions about managing alerts in Domo and get answers from Domo peers.
Distribute
Ask questions about Domo Everywhere, Scheduled Reports, Mobile and get best practices from Domo peers
Domo Everywhere
Ask questions about embedded analytics with Domo Everywhere.
Reporting
Ask questions about Scheduled Reports, Report Builder, and Slideshow Publications.
Manage
Ask questions about Governance Administration, Approvals, Teams, Alerts, and Buzz and get best practices from Domo peers
Governance & Security
Ask questions about People, Groups, Roles, Sandbox, Activity log, Buzz, Teams, Approvals and PDP and get best practices from Domo peers
Navigation & Productivity
Ask questions about navigation, Projects & Tasks, Goals, and Buzz chat.
APIs
Ask APIs and Developer.domo.com questions and get answers from Domo peers
Add-ins & Plugins
Ask questions about plugins, Microsoft add-ins, and other third-party software integrations.
Domo Community Gallery
Watch how our Customers are using Domo to solve their complex problems.
Product Releases
Domo support and product teams are here to live-answer questions about the most recent product releases. Please post questions in this Forum board for all users to benefit (rather than submitting a support ticket).
Domo University
Questions or discussions related to Domo University, trainings and certifications
Community Forums
Getting Started
Welcome to Domo's Community Forums! You'll find everything you need to get started in this category.
Community Announcements
Get the latest from Domo's Community Team.
Social Groups
Archive
Old or outdated content that could still be found helpful.